<!DOCTYPE html>
<html>
<head>
    <meta charset="utf-8">
    <meta name=viewport content="initial-scale=1.0, maximum-scale=1.0, user-scalable=no">
    <!--[if lt IE 9]>
    <script src="http://html5shim.googlecode.com/svn/trunk/html5.js"></script>
    <![endif]-->
    <title>Zepto.js-translate by yaotaiyang</title>
    <meta name="keywords" content="Zepto, Zepto API 中文版,Zepto 中文手册,Zepto API,Zepto API 中文版,Zepto 中文手册,Zepto API 1.0, Zepto API  1.0 中文版,Zepto 1.0 中文手册,Zepto  1.0 API" />
<meta name="description" content="Zepto, Zepto API 中文版,Zepto 中文手册,Zepto API,Zepto API 中文版,Zepto 中文手册,Zepto API 1.0, Zepto API  1.0 中文版,Zepto 1.0 中文手册,Zepto  1.0 API" />
    <meta name=description content="The aerogel-weight jQuery-compatible JavaScript library
">

    <link rel=stylesheet href=style.css>
    <meta name=apple-mobile-web-app-capable content=yes>
    <meta name=apple-mobile-web-app-status-bar-style content=white>
    <meta name=format-detection content="telephone=no"
    <link rel=apple-touch-icon-precomposed href=icon.png>
</head>
<body>

<div id="menu_icon">≣</div>

<aside id="sidebar" class="interface">

<a class="toc_title" href="#">
    Zepto.js <span class="version">(1.0)</span>
</a>

<ul class=toc_section>
    <li><a href="#download">Download</a></li>
    <li><a href="#platforms">Target Platforms</a></li>
    <li><a href="#changelog">Change Log</a></li>
    <li><a href="#thanks">Acknowledgements</a></li>
</ul>

<hr>

<a class=toc_title href="#core">Core</a>

<ul class=toc_section>

    <li><a href="#$()">$()</a></li>

    <li><a href="#$.camelCase">$.camelCase</a></li>

    <li><a href="#$.contains">$.contains</a></li>

    <li><a href="#$.each">$.each</a></li>

    <li><a href="#$.extend">$.extend</a></li>

    <li><a href="#$.fn">$.fn</a></li>

    <li><a href="#$.grep">$.grep</a></li>

    <li><a href="#$.inArray">$.inArray</a></li>

    <li><a href="#$.isArray">$.isArray</a></li>

    <li><a href="#$.isFunction">$.isFunction</a></li>

    <li><a href="#$.isPlainObject">$.isPlainObject</a></li>

    <li><a href="#$.isWindow">$.isWindow</a></li>

    <li><a href="#$.map">$.map</a></li>

    <li><a href="#$.parseJSON">$.parseJSON</a></li>

    <li><a href="#$.trim">$.trim</a></li>

    <li><a href="#$.type">$.type</a></li>

    <li><a href="#add">add</a></li>

    <li><a href="#addClass">addClass</a></li>

    <li><a href="#after">after</a></li>

    <li><a href="#append">append</a></li>

    <li><a href="#appendTo">appendTo</a></li>

    <li><a href="#attr">attr</a></li>

    <li><a href="#before">before</a></li>

    <li><a href="#children">children</a></li>

    <li><a href="#clone">clone</a></li>

    <li><a href="#closest">closest</a></li>

    <li><a href="#concat">concat</a></li>

    <li><a href="#contents">contents</a></li>

    <li><a href="#css">css</a></li>

    <li><a href="#data">data</a></li>

    <li><a href="#each">each</a></li>

    <li><a href="#empty">empty</a></li>

    <li><a href="#eq">eq</a></li>

    <li><a href="#filter">filter</a></li>

    <li><a href="#find">find</a></li>

    <li><a href="#first">first</a></li>

    <li><a href="#forEach">forEach</a></li>

    <li><a href="#get">get</a></li>

    <li><a href="#has">has</a></li>

    <li><a href="#hasClass">hasClass</a></li>

    <li><a href="#height">height</a></li>

    <li><a href="#hide">hide</a></li>

    <li><a href="#html">html</a></li>

    <li><a href="#index">index</a></li>

    <li><a href="#indexOf">indexOf</a></li>

    <li><a href="#insertAfter">insertAfter</a></li>

    <li><a href="#insertBefore">insertBefore</a></li>

    <li><a href="#is">is</a></li>

    <li><a href="#last">last</a></li>

    <li><a href="#map">map</a></li>

    <li><a href="#next">next</a></li>

    <li><a href="#not">not</a></li>

    <li><a href="#offset">offset</a></li>

    <li><a href="#offsetParent">offsetParent</a></li>

    <li><a href="#parent">parent</a></li>

    <li><a href="#parents">parents</a></li>

    <li><a href="#pluck">pluck</a></li>

    <li><a href="#position">position</a></li>

    <li><a href="#prepend">prepend</a></li>

    <li><a href="#prependTo">prependTo</a></li>

    <li><a href="#prev">prev</a></li>

    <li><a href="#prop">prop</a></li>

    <li><a href="#push">push</a></li>

    <li><a href="#ready">ready</a></li>

    <li><a href="#reduce">reduce</a></li>

    <li><a href="#remove">remove</a></li>

    <li><a href="#removeAttr">removeAttr</a></li>

    <li><a href="#removeClass">removeClass</a></li>

    <li><a href="#replaceWith">replaceWith</a></li>

    <li><a href="#scrollTop">scrollTop</a></li>

    <li><a href="#show">show</a></li>

    <li><a href="#siblings">siblings</a></li>

    <li><a href="#size">size</a></li>

    <li><a href="#slice">slice</a></li>

    <li><a href="#text">text</a></li>

    <li><a href="#toggle">toggle</a></li>

    <li><a href="#toggleClass">toggleClass</a></li>

    <li><a href="#unwrap">unwrap</a></li>

    <li><a href="#val">val</a></li>

    <li><a href="#width">width</a></li>

    <li><a href="#wrap">wrap</a></li>

    <li><a href="#wrapAll">wrapAll</a></li>

    <li><a href="#wrapInner">wrapInner</a></li>

</ul>


<a class=toc_title href="#detect">Detect</a>

<ul class=toc_section>

    <li><a href="#Detect module">Detect module</a></li>

</ul>


<a class=toc_title href="#event">Event</a>

<ul class=toc_section>

    <li><a href="#$.Event">$.Event</a></li>

    <li><a href="#$.proxy">$.proxy</a></li>

    <li><a href="#bind">bind</a></li>

    <li><a href="#delegate">delegate</a></li>

    <li><a href="#die">die</a></li>

    <li><a href="#live">live</a></li>

    <li><a href="#off">off</a></li>

    <li><a href="#on">on</a></li>

    <li><a href="#one">one</a></li>

    <li><a href="#trigger">trigger</a></li>

    <li><a href="#triggerHandler">triggerHandler</a></li>

    <li><a href="#unbind">unbind</a></li>

    <li><a href="#undelegate">undelegate</a></li>

</ul>


<a class=toc_title href="#ajax">Ajax</a>

<ul class=toc_section>

    <li><a href="#$.ajax">$.ajax</a></li>

    <li><a href="#$.ajaxJSONP">$.ajaxJSONP</a></li>

    <li><a href="#$.ajaxSettings">$.ajaxSettings</a></li>

    <li><a href="#$.get">$.get</a></li>

    <li><a href="#$.getJSON">$.getJSON</a></li>

    <li><a href="#$.param">$.param</a></li>

    <li><a href="#$.post">$.post</a></li>

    <li><a href="#load">load</a></li>

</ul>


<a class=toc_title href="#form">Form</a>

<ul class=toc_section>

    <li><a href="#serialize">serialize</a></li>

    <li><a href="#serializeArray">serializeArray</a></li>

    <li><a href="#submit">submit</a></li>

</ul>


<a class=toc_title href="#fx">Effects</a>

<ul class=toc_section>

    <li><a href="#$.fx">$.fx</a></li>

    <li><a href="#animate">animate</a></li>

</ul>


<a class=toc_title href="#touch">Touch</a>

<ul class=toc_section>

    <li><a href="#Touch events">Touch events</a></li>

</ul>

</aside>

<div class="container">

<header>
    <h1><img src=logo.png alt=Zepto.js></h1>

    <p>
        <b>Zepto</b>是一个轻量级的<b>针对现代高级浏览器的JavaScript库，
        </b>它与jquery<b>有着类似的api</b>。
        如果你会用jquery，那么你也会用zepto。
    </p>
    <p>
        设计的目的是提供jquery的类似的APIs，但并不是100%覆盖jquery为目的。zepto设计的目的是有一个5-10k的通用库、下载并执行快、有一个熟悉通用的API，所以你能把你主要的精力放到应用开发上。
    </p>

    <p>
        Zepto 是一款开源软件，它可以被开发者和商业发布。
        <a href="https://github.com/madrobby/zepto/blob/master/MIT-LICENSE">MIT license</a>.
    </p>
    <p>本API原文地址：<a href="http://zeptojs.com/">http://zeptojs.com/</a></p>
    <p>本文翻译问题请联系：<a href="mailto:yaoxiangyang@baidu.com">yaotaiyang</a></p>
    <p>
        <a href="http://twitter.com/share" class="twitter-share-button" data-url="http://zeptojs.com/" data-text="Zepto.js, a jQuery-compatible micro-library for modern browsers" data-count="horizontal" data-via="zeptojs" data-related="thomasfuchs">Tweet</a>
    </p>

</header>

<h3 id=download>下载 Zepto</h3>

<p>
    默认的构建包括以下模块：<br>
    <em>Core, Ajax, Event, Form, Effects, Polyfill, and Detect</em>.
</p>

<p class=compat>
    还有更多的模块; 所以可用模块链接在此 <a href="https://github.com/madrobby/zepto#readme">README</a>.
</p>

<ul class=downloads>
    <li>
      <a href="http://zeptojs.com/zepto.js" class="download">zepto.js v1.0 (源码)</a>
        – <i>54.6k uncompressed, lots of comments</i>
    </li>
    <li>
      <a href="http://zeptojs.com/zepto.min.js" class="download">zepto.min.js v1.0 (压缩代码)</a>
        – <i>9.7k when gzipped</i>
    </li>
    <li>
        <a href="https://github.com/madrobby/zepto">Source code on Github</a>
    </li>
</ul>

<p>
    用一个script标签引入Zepto到你的页面的底部：
</p>

<div class="highlight"><pre><code class="html">...
    <span class="nt">&lt;/body&gt;</span>
    <span class="nt">&lt;script </span><span class="na">src=</span><span class="s">zepto.min.js</span><span class="nt">&gt;&lt;/script&gt;</span>
    <span class="nt">&lt;/html&gt;</span>
</code></pre></div>

<p>
    如果你需要兼容ie浏览器，你可以用回jquery。
需要注意ie10以后不再支持条件注释(为了提高与HTML5 的可互操作性和兼容性，Internet Explorer 10 标准模式和Quirks 模式中删除了对条件注释的支持)，因此，我们建议以下的<code>document.write</code>方法：
</p>

<div class="highlight"><pre><code class="html"><span class="nt">&lt;script&gt;</span>
    <span class="nb">document</span><span class="p">.</span><span class="nx">write</span><span class="p">(</span><span class="s1">&#39;&lt;script src=&#39;</span> <span class="o">+</span>
    <span class="p">(</span><span class="s1">&#39;__proto__&#39;</span> <span class="k">in</span> <span class="p">{}</span> <span class="o">?</span> <span class="s1">&#39;zepto&#39;</span> <span class="o">:</span> <span class="s1">&#39;jquery&#39;</span><span class="p">)</span> <span class="o">+</span>
    <span class="s1">&#39;.js&gt;&lt;\/script&gt;&#39;</span><span class="p">)</span>
    <span class="nt">&lt;/script&gt;</span>
</code></pre></div>

<h3 id=platforms>目标平台</h3>

<h4>桌面浏览器</h4>
<ul>
    <li>Safari 5+ (Mac, Win)</li>
    <li>Chrome 5+ (Win, Mac, Linux, Chrome OS)</li>
    <li>Mozilla Firefox 4+ (Win, Mac, Linux)</li>
    <li>Opera 10+ (Win, Mac, Linux)</li>
</ul>

<h4>移动端浏览器</h4>
<ul>
    <li>iOS 4+ Safari</li>
    <li>Chrome for Android</li>
    <li>Chrome for iOS</li>
    <li>Android 2.2+ Browser</li>
    <li>webOS 1.4.5+ Browser</li>
    <li>BlackBerry Tablet OS 1.0.7+ Browser</li>
    <li>Amazon Silk 1.0+</li>
    <li>Firefox for Android</li>
    <li>Firefox OS Browser</li>
    <li>Practically any WebKit-based browsers/runtimes</li>
</ul>

<p>
    需要注意的是Zepto的一些可选功能是专门针对移动端浏览器的；因为它的最初目标在移动端提供一个精简的类似jquery的js库。
</p>

<p>在浏览器上(Safari和Chrome)上开发页面应用或者使用<a href="http://phonegap.com/">PhoneGap</a>构建基于html的web-view本地应用，使用Zepto是一个不错的选择。
<p>

<p>
    总之，除了ie浏览器外，Zepto希望在所有的现代浏览器中作为一种基础环境来使用。
</p>

<h3>手动建立Zepto</h3>

<p>
    <code>zepto.js</code>和<code>zepto.min.js</code>提供以上使用方式。
    然而，为了更好的程序效果和自由性，可以在使用Zepto源码构建Zepto.js和zepto.min.js的时候选择模块并作测试，
    使用<a href="https://github.com/mishoo/UglifyJS">UglifyJS</a>根据你的需要来生成当服务端开启gzipped后，最精简的代码。
</p>

<p>
    关于如何建立Zepto的<a href="https://github.com/madrobby/zepto#readme">the README</a>，包含运行测试和补丁。.
</p>

<h3>创建插件</h3>

<p>
    可以通过添加方法作为<a href="#$.fn"><code>$.fn</code></a>的属性来写插件：
</p>

<div class="highlight"><pre><code class="js"><span class="p">;(</span><span class="kd">function</span><span class="p">(</span><span class="nx">$</span><span class="p">){</span>
    <span class="nx">$</span><span class="p">.</span><span class="nx">extend</span><span class="p">(</span><span class="nx">$</span><span class="p">.</span><span class="nx">fn</span><span class="p">,</span> <span class="p">{</span>
    <span class="nx">foo</span><span class="o">:</span> <span class="kd">function</span><span class="p">(){</span>
    <span class="c1">// `this` refers to the current Zepto collection.</span>
    <span class="c1">// When possible, return the Zepto collection to allow chaining.</span>
    <span class="k">return</span> <span class="k">this</span><span class="p">.</span><span class="nx">html</span><span class="p">(</span><span class="s1">&#39;bar&#39;</span><span class="p">)</span>
    <span class="p">}</span>
    <span class="p">})</span>
    <span class="p">})(</span><span class="nx">Zepto</span><span class="p">)</span>
</code></pre></div>

<p>
    为了更好开始开发插件，先看下<a href="https://github.com/madrobby/zepto/blob/master/src/zepto.js">source of Zepto's core module</a>，并确认读过<a href="https://github.com/madrobby/zepto#code-style-guidelines">coding style guidelines</a>
</p>

<section id=documentation>

<hr>
<h2 id="core">核心方法</h2>


<article class=method id="$()">
    <h3>$()


    </h3>
  
  
  <pre class=signature><code>$(selector, [context]) ⇒ collection
      $(&lt;Zepto collection&gt;) ⇒ same collection
      $(&lt;DOM nodes&gt;) ⇒ collection
      $(htmlString) ⇒ collection
      $(htmlString, attributes) ⇒ collection [v1.0]
      Zepto(function($){ ... })
  </code></pre>

    <p>通过执行css选择器包装dom节点，创建元素或者从一个html片段来创建一个Zepto对象。</p>

    <p> Zepto集合是一个类似数组的对象，它具有链式方法来操作它指向的dom，除了$对象上的直接方法外(如<code>$.extend</code>)，文档对象中的所有方法都是集合方法。</p>

    <p>如果选择器中存在content参数(css选择器，dom，或者Zepto集合对象)，那么只在所给的节点背景下进行css选择器；这个功能有点像使用<code>$(context).find(selector)</code>。</p>

    <p>可以通过一个html字符串片段来创建一个dom节点。也可以通过给定一组属性映射来创建节点。最快的创建但元素，使用<code>&lt;div&gt;</code> 或 <code>&lt;div/&gt;</code>形式。</p>

    <p>当一个函数附加在 <code>DOMContentLoaded</code> 事件的处理流程中。如果页面已经加载完毕，这个方法将会立即被执行。</p>

    <div class="highlight"><pre><code class="js"><span class="nx">$</span><span class="p">(</span><span class="s1">&#39;div&#39;</span><span class="p">)</span>  <span class="c1">//=&gt; all DIV elements on the page</span>
        <span class="nx">$</span><span class="p">(</span><span class="s1">&#39;#foo&#39;</span><span class="p">)</span> <span class="c1">//=&gt; element with ID &quot;foo&quot;</span>

        <span class="c1">// create element:</span>
        <span class="nx">$</span><span class="p">(</span><span class="s2">&quot;&lt;p&gt;Hello&lt;/p&gt;&quot;</span><span class="p">)</span> <span class="c1">//=&gt; the new P element</span>
        <span class="c1">// create element with attributes:</span>
        <span class="nx">$</span><span class="p">(</span><span class="s2">&quot;&lt;p /&gt;&quot;</span><span class="p">,</span> <span class="p">{</span> <span class="nx">text</span><span class="o">:</span><span class="s2">&quot;Hello&quot;</span><span class="p">,</span> <span class="nx">id</span><span class="o">:</span><span class="s2">&quot;greeting&quot;</span><span class="p">,</span> <span class="nx">css</span><span class="o">:</span><span class="p">{</span><span class="nx">color</span><span class="o">:</span><span class="s1">&#39;darkblue&#39;</span><span class="p">}</span> <span class="p">})</span>
        <span class="c1">//=&gt; &lt;p id=greeting style=&quot;color:darkblue&quot;&gt;Hello&lt;/p&gt;</span>

        <span class="c1">// execute callback when the page is ready:</span>
        <span class="nx">Zepto</span><span class="p">(</span><span class="kd">function</span><span class="p">(</span><span class="nx">$</span><span class="p">){</span>
        <span class="nx">alert</span><span class="p">(</span><span class="s1">&#39;Ready to Zepto!&#39;</span><span class="p">)</span>
        <span class="p">})</span>
    </code></pre></div>




    <p class=compat>
        不支持<a href="http://api.jquery.com/category/selectors/jquery-selector-extensions/">jQuery CSS 扩展</a>，但是可以选的“selector”模块有限提供支持，如一些常用的伪选择器，可以与现有的代码或插件兼容执行。
    </p>


</article>

<article class=method id="$.camelCase">
    <h3>$.camelCase

        <span class=version>v1.0+</span>
    </h3>
  
  
  <pre class=signature><code>$.camelCase(string) ⇒ string
  </code></pre>

    <p>将一组字符串变成“骆驼”命名法的新字符串，如果该字符已经是“骆驼”命名法，则不变化。</p>

    <div class="highlight"><pre><code class="js"><span class="nx">$</span><span class="p">.</span><span class="nx">camelCase</span><span class="p">(</span><span class="s1">&#39;hello-there&#39;</span><span class="p">)</span> <span class="c1">//=&gt; &quot;helloThere&quot;</span>
        <span class="nx">$</span><span class="p">.</span><span class="nx">camelCase</span><span class="p">(</span><span class="s1">&#39;helloThere&#39;</span><span class="p">)</span>  <span class="c1">//=&gt; &quot;helloThere&quot;</span>
    </code></pre></div>




</article>

<article class=method id="$.contains">
    <h3>$.contains

        <span class=version>v1.0+</span>
    </h3>
  
  
  <pre class=signature><code>$.contains(parent, node) ⇒ boolean
  </code></pre>

    <p>检查父节点是否包含给定的dom节点，如果两者相同，则返回 <code>false</code>。</p>

</article>

<article class=method id="$.each">
    <h3>$.each


    </h3>
  
  
  <pre class=signature><code>$.each(collection, function(index, item){ ... }) ⇒ collection
  </code></pre>

    <p>遍历数组元素或以key-value值对方式遍历对象。回调函数返回 <code>false</code> 时停止遍历。</p>

    <div class="highlight"><pre><code class="js"><span class="nx">$</span><span class="p">.</span><span class="nx">each</span><span class="p">([</span><span class="s1">&#39;a&#39;</span><span class="p">,</span> <span class="s1">&#39;b&#39;</span><span class="p">,</span> <span class="s1">&#39;c&#39;</span><span class="p">],</span> <span class="kd">function</span><span class="p">(</span><span class="nx">index</span><span class="p">,</span> <span class="nx">item</span><span class="p">){</span>
        <span class="nx">console</span><span class="p">.</span><span class="nx">log</span><span class="p">(</span><span class="s1">&#39;item %d is: %s&#39;</span><span class="p">,</span> <span class="nx">index</span><span class="p">,</span> <span class="nx">item</span><span class="p">)</span>
        <span class="p">})</span>

        <span class="kd">var</span> <span class="nx">hash</span> <span class="o">=</span> <span class="p">{</span> <span class="nx">name</span><span class="o">:</span> <span class="s1">&#39;zepto.js&#39;</span><span class="p">,</span> <span class="nx">size</span><span class="o">:</span> <span class="s1">&#39;micro&#39;</span> <span class="p">}</span>
        <span class="nx">$</span><span class="p">.</span><span class="nx">each</span><span class="p">(</span><span class="nx">hash</span><span class="p">,</span> <span class="kd">function</span><span class="p">(</span><span class="nx">key</span><span class="p">,</span> <span class="nx">value</span><span class="p">){</span>
        <span class="nx">console</span><span class="p">.</span><span class="nx">log</span><span class="p">(</span><span class="s1">&#39;%s: %s&#39;</span><span class="p">,</span> <span class="nx">key</span><span class="p">,</span> <span class="nx">value</span><span class="p">)</span>
        <span class="p">})</span>
    </code></pre></div>




</article>

<article class=method id="$.extend">
    <h3>$.extend


    </h3>
  
  
  <pre class=signature><code>$.extend(target, [source, [source2, ...]]) ⇒ target
      $.extend(true, target, [source, ...]) ⇒ target [v1.0]
  </code></pre>

    <p>通过源对象扩展目标对象的属性，源对象属性将覆盖目标对象属性。</p>

    <p>默认情况下为，复制为浅复制。如果第一个参数为true表示深度复制。</p>

    <div class="highlight"><pre><code class="js"><span class="kd">var</span> <span class="nx">target</span> <span class="o">=</span> <span class="p">{</span> <span class="nx">one</span><span class="o">:</span> <span class="s1">&#39;patridge&#39;</span> <span class="p">},</span>
        <span class="nx">source</span> <span class="o">=</span> <span class="p">{</span> <span class="nx">two</span><span class="o">:</span> <span class="s1">&#39;turtle doves&#39;</span> <span class="p">}</span>

        <span class="nx">$</span><span class="p">.</span><span class="nx">extend</span><span class="p">(</span><span class="nx">target</span><span class="p">,</span> <span class="nx">source</span><span class="p">)</span>
        <span class="c1">//=&gt; { one: &#39;patridge&#39;,</span>
        <span class="c1">//     two: &#39;turtle doves&#39; }</span>
    </code></pre></div>




</article>

<article class=method id="$.fn">
    <h3>$.fn</h3>
    <p> <code>Zepto.fn</code>是一个对象，它拥有Zepto对象上所有可用的方法。如 <a href="#addClass"><code>addClass()</code></a>， <a href="#attr"><code>attr()</code></a>，和其它方法。在这个对象添加一个方法，所有的Zepto对象上都能用到该方法。</p>
    <p>这里有一个实现  <a href="#empty"><code>empty()</code></a> 方法的例子：</p>

    <div class="highlight">
      <pre><code class="js"><span class="nx">$</span><span class="p">.</span><span class="nx">fn</span><span class="p">.</span><span class="nx">empty</span> <span class="o">=</span> <span class="kd">function</span><span class="p">(){</span>
        <span class="k">return</span> <span class="k">this</span><span class="p">.</span><span class="nx">each</span><span class="p">(</span><span class="kd">function</span><span class="p">(){</span> <span class="k">this</span><span class="p">.</span><span class="nx">innerHTML</span> <span class="o">=</span> <span class="s1">&#39;&#39;</span> <span class="p">})</span>
        <span class="p">}</span>
  </code></pre></div>




</article>

<article class=method id="$.grep">
    <h3>$.grep

        <span class=version>v1.0+</span>
    </h3>
  
  
  <pre class=signature><code>$.grep(items, function(item){ ... }) ⇒ array</code></pre>
  <div class="highlight">
    <pre><code class="js"><span class="nx">$</span><span class="p">.</span><span class="nx">grep</span><span class="p">([1,2,3],</span> <span class="kd">function</span><span class="p">(){</span>
  <span class="k">return</span><span class="p"> item &gt; 1
});</span><span class="p"></span>
 <span class="c1">//=&gt;[2,3]</span> 
  </code>
</pre></div>
<p>获取一个新数组，新数组只包含回调函数中返回 ture 的数组项。</p>

</article>

<article class=method id="$.inArray">
    <h3>$.inArray

        <span class=version>v1.0+</span>
    </h3>
  
  
  <pre class=signature><code>$.inArray(element, array, [fromIndex]) ⇒ number
  </code></pre>

    <p>搜索数组中指定值并返回它的索引（如果没有找到则返回-1）。</p>
    <p><code>[fromIndex]</code> 参数可选，表示从哪个索引值开始向后查找。</p>
    <div class="highlight">
      <pre><code class="js"><span class="nx">$</span><span class="p">.</span><span class="nx">inArray</span><span class="p">("abc",["bcd","abc","edf","aaa"</span><span class="p">]);</span><span class="p"></span>
 <span class="c1">//=&gt;1</span>

<span class="nx">$</span><span class="p">.</span><span class="nx">inArray</span><span class="p">("abc",["bcd","abc","edf","aaa"</span><span class="p">],1);</span><span class="p"></span>
 <span class="c1">//=&gt;1</span>

<span class="nx">$</span><span class="p">.</span><span class="nx">inArray</span><span class="p">("abc",["bcd","abc","edf","aaa"</span><span class="p">],2);</span><span class="p"></span>
 <span class="c1">//=&gt;-1</span>
  </code>   </pre>
    </div>
</article>

<article class=method id="$.isArray">
  <h3>$.isArray
    
    
  </h3>
  
  
  <pre class=signature><code>$.isArray(object) ⇒ boolean
  </code></pre>
  
  <p>如果object是array，则返回ture。</p>
  
</article>

<article class=method id="$.isFunction">
  <h3>$.isFunction
    
    
  </h3>
  
  
  <pre class=signature><code>$.isFunction(object) ⇒ boolean
  </code></pre>
  
  <p>如果object是function，则返回ture。</p>
  
</article>

<article class=method id="$.isPlainObject">
  <h3>$.isPlainObject
    
    <span class=version>v1.0+</span>
  </h3>
  
  
  <pre class=signature><code>$.isPlainObject(object) ⇒ boolean
  </code></pre>
  
  <p>测试对象是否是纯粹的对象（通过 "{}" 或者 "new Object" 创建的），如果是，则返回true。  </p>
  <div class="highlight">
    <pre><code class="js"><span class="nx">$</span><span class="p">.</span><span class="nx">isPlainObject</span><span class="p">({})</span>         <span class="c1">// =&gt; true</span>
        <span class="nx">$</span><span class="p">.</span><span class="nx">isPlainObject</span><span class="p">(</span><span class="k">new</span> <span class="nb">Object</span><span class="p">)</span> <span class="c1">// =&gt; true</span>
        <span class="nx">$</span><span class="p">.</span><span class="nx">isPlainObject</span><span class="p">(</span><span class="k">new</span> <span class="nb">Date</span><span class="p">)</span>   <span class="c1">// =&gt; false</span>
        <span class="nx">$</span><span class="p">.</span><span class="nx">isPlainObject</span><span class="p">(</span><span class="nb">window</span><span class="p">)</span>     <span class="c1">// =&gt; false</span>
    </code></pre>
  </div>
  
  
  
  
</article>

<article class=method id="$.isWindow">
  <h3>$.isWindow
    
    <span class=version>v1.0+</span>
  </h3>
  
  
  <pre class=signature><code>$.isWindow(object) ⇒ boolean
  </code></pre>
  
  <p>确定参数是否为一个窗口（window对象），如果是则返回true。</p>
  <p>这在处理iframe时非常有用，因为每个iframe都有它们自己的window对象，使用常规方法obj==window校验这些objects的时候会失败。</p>
</article>

<article class=method id="$.map">
</article>
<article class=method id="$.map">
  <h3>$.map
    
    
  </h3>
  
  
  <pre class=signature><code>$.map(collection, function(item, index){ ... }) ⇒ collection
  </code></pre>
  
  <p>通过遍历集合中的元素，通过函数返回一个新的数组，<code>null</code> and <code>undefined</code> 将被过滤掉。  </p>
  <div class="highlight">
    <pre><code class="js"><span class="nx">$</span><span class="p">.</span><span class="nx">map([1,2,3,4,5],</span><span class="kd">function</span><span class="p">(item,index){</span>
        if(item&gt;1){<span class="k">return</span><span class="k"></span><span class="p"></span><span class="nx"></span><span class="p"></span><span class="kd"></span><span class="p"></span><span class="k"></span><span class="p"></span><span class="nx"></span><span class="o"></span><span class="s1"></span><span class="p"> item*item;}
}</span><span class="nx">)</span><span class="nx"></span>; <span class="o"></span></code>
<code class="js"><span class="c1">// =&gt;[4, 9, 16, 25]</span></code>

<code class="js"><span class="nx">$</span><span class="p">.</span><span class="nx">map({&quot;yao&quot;:1,&quot;tai&quot;:2,&quot;yang&quot;:3},</span><span class="kd">function</span><span class="p">(item,index){</span>
        if(item&gt;1){<span class="k">return</span><span class="k"></span><span class="p"></span><span class="nx"></span><span class="p"></span><span class="kd"></span><span class="p"></span><span class="k"></span><span class="p"></span><span class="nx"></span><span class="o"></span><span class="s1"></span><span class="p"> item*item;}
}</span><span class="nx">)</span><span class="nx"></span>; <span class="o"></span></code>
<code class="js"><span class="c1">// =&gt;[4, 9]</span></code></pre>
  </div>
</article>

<article class=method id="$.parseJSON">
  <h3>$.parseJSON
    
    <span class=version>v1.0+</span>
  </h3>
  
  
  <pre class=signature><code>$.parseJSON(string) ⇒ object
  </code></pre>
  
  <p>类似本地<code>JSON.parse</code> 方法，接受一个标准格式的 JSON 字符串，并返回解析后的 JavaScript 对象。</p>
  
</article>

<article class=method id="$.trim">
  <h3>$.trim
    
    <span class=version>v1.0+</span>
  </h3>
  
  
  <pre class=signature><code>$.trim(string) ⇒ string
  </code></pre>
  
  <p>删除字符串开始和末尾的空白符。类似String.prototype.trim()。</p>
</article>

<article class=method id="$.type">
</article>
<article class=method id="$.type">
  <h3>$.type
    
    <span class=version>v1.0+</span>
  </h3>
  
  
  <pre class=signature><code>$.type(object) ⇒ string
  </code></pre>
  
  <p>获取JavaScript 对象的类型。可能的类型有： <code>null</code> <code>undefined</code> <code>boolean</code> <code>number</code> <code>string</code> <code>function</code> <code>array</code> <code>date</code> <code>regexp</code> <code>object</code> <code>error</code>。</p>
  <p>对于其它对象，它只是简单报告为“object”，如果你想知道一个对象是否是一个javascript普通对象，使用 <a href="#$.isPlainObject">isPlainObject</a>。</p>
  
</article>

<article class=method id="add">
  <h3>add
    
    
  </h3>
  
  
  <pre class=signature><code>add(selector, [context]) ⇒ self
  </code></pre>
  
  <p>添加元素到匹配的元素集合。如果content参数存在，只在content中进行查找，否则在document中查找。</p>
  <div class="highlight">
    <pre>&lt;ul&gt;    
    &lt;li&gt;list item 1&lt;/li&gt;    
    &lt;li&gt;list item 2&lt;/li&gt;    
    &lt;li&gt;list item 3&lt;/li&gt;  
&lt;/ul&gt;  
&lt;p&gt;a paragraph&lt;/p&gt;

&lt;script type=&quot;text/javascript&quot;&gt;
	$('li').add('p').css('background-color', 'red');
&lt;/script&gt;</pre>
  </div>
  <p>&nbsp;</p>
</article>

<article class=method id="addClass">
</article>
<article class=method id="addClass">
  <h3>addClass
    
    
  </h3>
  
  
  <pre class=signature><code>addClass(name) ⇒ self
      addClass(function(index, oldClassName){ ... }) ⇒ self
  </code></pre>
  
  <p>为每个匹配的元素添加指定的class类名。多个class类名通过空格f分隔。</p>
</article>

<article class=method id="after">
</article>
<article class=method id="after">
  <h3>after
    
    
  </h3>
  
  
  <pre class=signature><code>after(content) ⇒ self
  </code></pre>
  
  <p>在每个匹配的元素后插入内容。内容可以为html字符串，dom节点，或者节点组成的数组。  </p>
  <div class="highlight">
    <pre><code class="js"><span class="nx">$</span><span class="p">(</span><span class="s1">&#39;form label&#39;</span><span class="p">).</span><span class="nx">after</span><span class="p">(</span><span class="s1">&#39;&lt;p&gt;A note below the label&lt;/p&gt;&#39;</span><span class="p">)</span>
    </code></pre>
  </div>
  
  
  
  
</article>

<article class=method id="append">
  <h3>append
    
    
  </h3>
  
  
  <pre class=signature><code>append(content) ⇒ self
  </code></pre>
  
  <p>在每个匹配的元素末尾插入内容。内容可以为html字符串，dom节点，或者节点组成的数组。  </p>
  <div class="highlight">
    <pre><code class="js"><span class="nx">$</span><span class="p">(</span><span class="s1">&#39;ul&#39;</span><span class="p">).</span><span class="nx">append</span><span class="p">(</span><span class="s1">&#39;&lt;li&gt;new list item&lt;/li&gt;&#39;</span><span class="p">)</span>
    </code></pre>
  </div>
  
  
  
  
</article>

<article class=method id="appendTo">
  <h3>appendTo
    
    
  </h3>
  
  
  <pre class=signature><code>appendTo(target) ⇒ self
  </code></pre>
  
  <p>将匹配的元素插入到目标元素的末尾（里面的后面）。这个有点像 <a href="#append">append</a>，但是插入的目标与其相反。  </p>
  <div class="highlight">
    <pre><code class="js"><span class="nx">$</span><span class="p">(</span><span class="s1">&#39;&lt;li&gt;new list item&lt;/li&gt;&#39;</span><span class="p">).</span><span class="nx">appendTo</span><span class="p">(</span><span class="s1">&#39;ul&#39;</span><span class="p">)</span>
    </code></pre>
  </div>
  
  
  
  
</article>

<article class=method id="attr">
  <h3>attr
    
    
  </h3>
  
  
  <pre class=signature><code>attr(name) ⇒ string
      attr(name, value) ⇒ self
      attr(name, function(index, oldValue){ ... }) ⇒ self
      attr({ name: value, name2: value2, ... }) ⇒ self
  </code></pre>
  
  <p>读取或设置dom的属性。如果没有给定value参数，则读取Zepto对象第集合一个元素的属性值。当给定了value参数。则设置Zepto对象集合中所有元素所有元素的属性值。当value参数为<code>null</code>，那么这个属性将被移除(类似<a href="#removeAttr">removeAttr</a>)，多个属性能以通过对象值对的方式进行设置。  </p>
  <p>要读取dom的属性如 <code>checked</code>和<code>selected</code>, 使用 <a href="#prop">prop</a>。</p>
  
  <div class="highlight">
    <pre><code class="js"><span class="kd">var</span> <span class="nx">form</span> <span class="o">=</span> <span class="nx">$</span><span class="p">(</span><span class="s1">&#39;form&#39;</span><span class="p">)</span>
        <span class="nx">form</span><span class="p">.</span><span class="nx">attr</span><span class="p">(</span><span class="s1">&#39;action&#39;</span><span class="p">)</span>             <span class="c1">//=&gt; read value</span>
        <span class="nx">form</span><span class="p">.</span><span class="nx">attr</span><span class="p">(</span><span class="s1">&#39;action&#39;</span><span class="p">,</span> <span class="s1">&#39;/create&#39;</span><span class="p">)</span>  <span class="c1">//=&gt; set value</span>
        <span class="nx">form</span><span class="p">.</span><span class="nx">attr</span><span class="p">(</span><span class="s1">&#39;action&#39;</span><span class="p">,</span> <span class="kc">null</span><span class="p">)</span>       <span class="c1">//=&gt; remove attribute</span>

        <span class="c1">// multiple attributes:</span>
        <span class="nx">form</span><span class="p">.</span><span class="nx">attr</span><span class="p">({</span>
        <span class="nx">action</span><span class="o">:</span> <span class="s1">&#39;/create&#39;</span><span class="p">,</span>
        <span class="nx">method</span><span class="o">:</span> <span class="s1">&#39;post&#39;</span>
        <span class="p">})</span>
    </code></pre>
  </div>
  
  
  
  
</article>

<article class=method id="before">
  <h3>before
    
    
  </h3>
  
  
  <pre class=signature><code>before(content) ⇒ self
  </code></pre>
  
  <p>在匹配每个元素的前面（外面）插入内容。内容可以为html字符串，dom节点，或者节点组成的数组。  </p>
  <div class="highlight">
    <pre><code class="js"><span class="nx">$</span><span class="p">(</span><span class="s1">&#39;table&#39;</span><span class="p">).</span><span class="nx">before</span><span class="p">(</span><span class="s1">&#39;&lt;p&gt;See the following table:&lt;/p&gt;&#39;</span><span class="p">)</span>
    </code></pre>
  </div>
  
  
  
  
</article>

<article class=method id="children">
  <h3>children
    
    
  </h3>
  
  
  <pre class=signature><code>children([selector]) ⇒ collection
  </code></pre>
  
  <p>获得每个匹配元素集合元素的直接子元素，如果selector存在，只返回符合css选择器的元素。  </p>
  <div class="highlight">
    <pre><code class="js"><span class="nx">$</span><span class="p">(</span><span class="s1">&#39;ol&#39;</span><span class="p">).</span><span class="nx">children</span><span class="p">(</span><span class="s1">&#39;*:nth-child(2n)&#39;</span><span class="p">)</span>
        <span class="c1">//=&gt; every other list item from every ordered list</span>
    </code></pre>
  </div>
  
  
  
  
</article>

<article class=method id="clone">
  <h3>clone
    
    <span class=version>v1.0+</span>
  </h3>
  
  
  <pre class=signature><code>clone() ⇒ collection
  </code></pre>
  
  <p>通过深度克隆来复制集合中的所有元素。  </p>
  <p class=compat>此方法不会有数据和事件处理程序复制到新的元素。这点和jquery中利用一个参数来确定是否复制数据和事件处理不相同。</p>
</article>

<article class=method id="closest">
</article>
<article class=method id="closest">
  <h3>closest
    
    
  </h3>
  
  
  <pre class=signature><code>closest(selector, [context]) ⇒ collection
      closest(collection) ⇒ collection [v1.0]
      closest(element) ⇒ collection [v1.0]
  </code></pre>
  
  <p>从元素本身开始，逐级向上级元素匹配，并返回最先匹配selector的祖先元素。如果contextj节点参数存在。那么直考虑该节点的后代。这个方法与 <a href="#parents"><code>parents(selector)</code></a>有点相像，但他只返回最先匹配的祖先元素。</p>
  <p>&nbsp;</p>
  
  <p>如果参数是一个Zepto对象集合或者一个元素，结果必须匹配给定的元素而不是选择器。  </p>
  <div class="highlight">
    <pre><code class="js"><span class="kd">var</span> <span class="nx">input</span> <span class="o">=</span> <span class="nx">$</span><span class="p">(</span><span class="s1">&#39;input[type=text]&#39;</span><span class="p">)</span>
        <span class="nx">input</span><span class="p">.</span><span class="nx">closest</span><span class="p">(</span><span class="s1">&#39;form&#39;</span><span class="p">)</span>
    </code></pre>
  </div>
  
  
  
  
</article>

<article class=method id="concat">
  <h3>concat
    
    
  </h3>
  
  
  <pre class=signature><code>concat(nodes, [node2, ...]) ⇒ self
  </code></pre>
  
  <p>添加元素到一个Zepto对象集合形成一个新数组。如果参数是一个数组，那么这个数组中的元素将会合并到Zepto对象集合中。</p>
  <p class=compat>这是一个Zepto提供的方法，不是jquey的API 。
</p>
</article>

<article class=method id="contents">
</article>
<article class=method id="contents">
  <h3>contents
    
    <span class=version>v1.0+</span>
  </h3>
  
  
  <pre class=signature><code>contents() ⇒ collection
  </code></pre>
  
  <p>获得每个匹配元素集合元素的子元素，包括文字和注释节点。.contents()和<a href="#children">.children()</a>方法类似，只不过前者包括文本节点以及jQuery对象中产生的HTML元素。</p>
</article>

<article class=method id="css">
</article>
<article class=method id="css">
  <h3>css
    
    
  </h3>
  
  
  <pre class=signature><code>css(property) ⇒ value
      css(property, value) ⇒ self
      css({ property: value, property2: value2, ... }) ⇒ self
  </code></pre>
  
  <p>读取或设置dom元素的css属性。当value参数不存在的时候，返回Zepto对象集合中第一个元素的css属性。当value参数存在时，设置Zepto对象集合中每一个元素的对应css属性。多条css属性可以利用对象值对的方式进行设置。</p>
  <p>当value为空(空字符串，<code>null</code> 或 <code>undefined</code>)，那个css属性将会被移出。当value参数为一个无单位的数字，如果该css属性需要单位，“px”将会自动添加到该属性上。  </p>
  <div class="highlight">
    <pre><code class="js"><span class="kd">var</span> <span class="nx">elem</span> <span class="o">=</span> <span class="nx">$</span><span class="p">(</span><span class="s1">&#39;h1&#39;</span><span class="p">)</span>
        <span class="nx">elem</span><span class="p">.</span><span class="nx">css</span><span class="p">(</span><span class="s1">&#39;background-color&#39;</span><span class="p">)</span>          <span class="c1">// read property</span>
        <span class="nx">elem</span><span class="p">.</span><span class="nx">css</span><span class="p">(</span><span class="s1">&#39;background-color&#39;</span><span class="p">,</span> <span class="s1">&#39;#369&#39;</span><span class="p">)</span>  <span class="c1">// set property</span>
        <span class="nx">elem</span><span class="p">.</span><span class="nx">css</span><span class="p">(</span><span class="s1">&#39;background-color&#39;</span><span class="p">,</span> <span class="s1">&#39;&#39;</span><span class="p">)</span>      <span class="c1">// remove property</span>

        <span class="c1">// set multiple properties:</span>
        <span class="nx">elem</span><span class="p">.</span><span class="nx">css</span><span class="p">({</span> <span class="nx">backgroundColor</span><span class="o">:</span> <span class="s1">&#39;#8EE&#39;</span><span class="p">,</span> <span class="nx">fontSize</span><span class="o">:</span> <span class="mi">28</span> <span class="p">})</span>
    </code></pre>
  </div>
  
  
  
  
</article>

<article class=method id="data">
  <h3>data
    
    
  </h3>
  
  
  <pre class=signature><code>data(name) ⇒ value
      data(name, value) ⇒ self
  </code></pre>
  
  <p>读取或写入dom的 <code>data-*</code> 属性。行为有点像 <a href="#attr">attr</a> ，但是属性名称前面加上
    <code>data-</code>。</p>
  <p>当读取属性值时，会有下列转换：<span class="version">v1.0+</span></p>
    <ul>
    <li>&ldquo;true&rdquo;, &ldquo;false&rdquo;, and &ldquo;null&rdquo; 被转换为相应的类型；</li>
    <li>数字值转换为实际的数字类型；</li>
    <li>JSON值将会被解析，如果它是有效的JSON；</li>
    <li>其它的一切作为字符串返回。
      <p class=compat>Zepto
        基本实现`data()`只能存储字符串。如果你要存储任意对象，请引入可选的“data”模块到你构建的Zepto中。    </p>
    </li>
    </ul>
</article>

<article class=method id="each">
  <h3>each
    
    
  </h3>
  
  
  <pre class=signature><code>each(function(index, item){ ... }) ⇒ self
  </code></pre>
  
  <p>遍历一个Zepto集合对象，为每一个匹配元素执行一个函数。<code>this</code>关键字指向当前item(作为函数的第二个参数传递)。如果函数返回 <code>false</code>，遍历结束。  </p>
  <div class="highlight">
    <pre><code class="js"><span class="nx">$</span><span class="p">(</span><span class="s1">&#39;form input&#39;</span><span class="p">).</span><span class="nx">each</span><span class="p">(</span><span class="kd">function</span><span class="p">(</span><span class="nx">index</span><span class="p">){</span>
        <span class="nx">console</span><span class="p">.</span><span class="nx">log</span><span class="p">(</span><span class="s1">&#39;input %d is: %o&#39;</span><span class="p">,</span> <span class="nx">index</span><span class="p">,</span> <span class="k">this</span><span class="p">)</span>
        <span class="p">})</span>
    </code></pre>
  </div>
  
  
  
  
</article>

<article class=method id="empty">
  <h3>empty
    
    
  </h3>
  
  
  <pre class=signature><code>empty() ⇒ self
  </code></pre>
  
  <p>从Zepto对象集合中移除所有的dom子节点。</p>
  
</article>

<article class=method id="eq">
  <h3>eq
    
    
  </h3>
  
  
  <pre class=signature><code>eq(index) ⇒ collection
  </code></pre>
  
  <p>从当前Zepto对象集合中获取给定索引号的元素。  </p>
  <div class="highlight">
    <pre><code class="js"><span class="nx">$</span><span class="p">(</span><span class="s1">&#39;li&#39;</span><span class="p">).</span><span class="nx">eq</span><span class="p">(</span><span class="mi">0</span><span class="p">)</span>   <span class="c1">//=&gt; only the first list item</span>
        <span class="nx">$</span><span class="p">(</span><span class="s1">&#39;li&#39;</span><span class="p">).</span><span class="nx">eq</span><span class="p">(</span><span class="o">-</span><span class="mi">1</span><span class="p">)</span>  <span class="c1">//=&gt; only the last list item</span>
    </code></pre>
  </div>
  
  
  
  
</article>

<article class=method id="filter">
  <h3>filter
    
    
  </h3>
  
  
  <pre class=signature><code>filter(selector) ⇒ collection
      filter(function(index){ ... }) ⇒ collection [v1.0]
  </code></pre>
  
  <p>过滤Zept集合对象，返回的Zept集合对象里面的项满足参数中的css选择器。如果参数为一个函数，函数返回有实际值得时候，元素才会被返回。在函数中， <code>this</code> 关键字指向当前的元素。  </p>
  <p>与此相反的功能，查看<a href="#not">not</a>.</p>
  
</article>

<article class=method id="find">
  <h3>find
    
    
  </h3>
  
  
  <pre class=signature><code>find(selector) ⇒ collection
      find(collection) ⇒ collection [v1.0]
      find(element) ⇒ collection [v1.0]
  </code></pre>
  
  <p>获得当前Zepto集合对象内查找符合css选择器的每个元素的后代。  </p>
  <p>如果参数为Zepto集合对象或者元素，过滤它们，只有当它们在当前Zepto集合对象中时，才回被返回。  </p>
  <div class="highlight">
    <pre><code class="js"><span class="kd">var</span> <span class="nx">form</span> <span class="o">=</span> <span class="nx">$</span><span class="p">(</span><span class="s1">&#39;#myform&#39;</span><span class="p">)</span>
        <span class="nx">form</span><span class="p">.</span><span class="nx">find</span><span class="p">(</span><span class="s1">&#39;input, select&#39;</span><span class="p">)</span>
    </code></pre>
  </div>
  
  
  
  
</article>

<article class=method id="first">
  <h3>first
    
    
  </h3>
  
  
  <pre class=signature><code>first() ⇒ collection
  </code></pre>
  
  <p>获取当前Zepto对象集合中的第一个元素。  </p>
  <div class="highlight">
    <pre><code class="js"><span class="nx">$</span><span class="p">(</span><span class="s1">&#39;form&#39;</span><span class="p">).</span><span class="nx">first</span><span class="p">()</span>
    </code></pre>
  </div>
  
  
  
  
</article>

<article class=method id="forEach">
  <h3>forEach
    
    
  </h3>
  
  
  <pre class=signature><code>forEach(function(item, index, array){ ... }, [context])
  </code></pre>
  
  <p>遍历当前Zepto集合对象的买个元素，有点类似 <a href="#each"> each</a>，但是遍历函数的参数不一样，当函数返回 <code>false</code> 的时候，遍历不会停止。  </p>
  <p class=compat>
    这是一个Zepto提供的方法，不是jquery的API。</p>
  
  
</article>

<article class=method id="get">
  <h3>get
    
    
  </h3>
  
  
  <pre class=signature><code>get() ⇒ array
      get(index) ⇒ DOM node
  </code></pre>
  
  <p>从当前Zepto对象集合中获取所有元素或单个元素。当index参数不存在的时候，以普通数组的方式返回所有的元素。当指定index时，只返回该置的元素。这点与与<a href="#eq">eq</a>不同，该方法返回的不是Zepto集合对象。  </p>
  <div class="highlight">
    <pre><code class="js"><span class="kd">var</span> <span class="nx">elements</span> <span class="o">=</span> <span class="nx">$</span><span class="p">(</span><span class="s1">&#39;h2&#39;</span><span class="p">)</span>
        <span class="nx">elements</span><span class="p">.</span><span class="nx">get</span><span class="p">()</span>   <span class="c1">//=&gt; get all headings as an array</span>
        <span class="nx">elements</span><span class="p">.</span><span class="nx">get</span><span class="p">(</span><span class="mi">0</span><span class="p">)</span>  <span class="c1">//=&gt; get first heading node</span>
    </code></pre>
  </div>
  
  
  
  
</article>

<article class=method id="has">
  <h3>has
    
    <span class=version>v1.0+</span>
  </h3>
  
  
  <pre class=signature><code>has(selector) ⇒ collection
      has(node) ⇒ collection
  </code></pre>
  
  <p>判断当前Zepto对象集合的子元素是否有符合选择器的元素，或者是否包含指定的dom节点，如果有，则返回新的Zepto集合对象，该对象过滤掉不含有选择器匹配元素或者不含有指定dom节点的对象。  </p>
  <div class="highlight">
    <pre><code class="js"><span class="nx">$</span><span class="p">(</span><span class="s1">&#39;ol &gt; li&#39;</span><span class="p">).</span><span class="nx">has</span><span class="p">(</span><span class="s1">&#39;a[href]&#39;</span><span class="p">)</span>
        <span class="c1">//=&gt; get only LI elements that contain links</span>
    </code></pre>
  </div>
  
  
  
  
</article>

<article class=method id="hasClass">
  <h3>hasClass
    
    
  </h3>
  
  
  <pre class=signature><code>hasClass(name) ⇒ boolean
  </code></pre>
  
  <p>检查Zepto对象集合中是否有元素含有指定的class。</p>
  <div class="highlight">
    <pre>&lt;ul&gt;    
    &lt;li&gt;list item 1&lt;/li&gt;    
    &lt;li class=&quot;yaotaiyang&quot;&gt;list item 2&lt;/li&gt;    
    &lt;li&gt;list item 3&lt;/li&gt;  
&lt;/ul&gt;  
&lt;p&gt;a paragraph&lt;/p&gt;

&lt;script type=&quot;text/javascript&quot;&gt;
	$(&quot;li&quot;).hasClass("yaotaiyang");
<code class="js"><span class="c1">	//=&gt; true</span></code>
&lt;/script&gt;</pre>
  </div>
</article>

<article class=method id="height">
  <h3>height
    
    
  </h3>
  
  
  <pre class=signature><code>height() ⇒ number
      height(value) ⇒ self
      height(function(index, oldHeight){ ... }) ⇒ self
  </code></pre>
  
  <p>获取Zepto对象集合中第一个元素的高度；或者设置Zepto对象集合中所有元素的高度。  </p>
  <div class="highlight">
    <pre><code class="js"><span class="nx">$</span><span class="p">(</span><span class="s1">&#39;#foo&#39;</span><span class="p">).</span><span class="nx">height</span><span class="p">()</span>   <span class="c1">// =&gt; 123</span>
        <span class="nx">$</span><span class="p">(</span><span class="nb">window</span><span class="p">).</span><span class="nx">height</span><span class="p">()</span>   <span class="c1">// =&gt; 838 (viewport height)</span>
        <span class="nx">$</span><span class="p">(</span><span class="nb">document</span><span class="p">).</span><span class="nx">height</span><span class="p">()</span> <span class="c1">// =&gt; 22302</span>
    </code></pre>
  </div>
  
  
  
  
</article>

<article class=method id="hide">
  <h3>hide
    
    
  </h3>
  
  
  <pre class=signature><code>hide() ⇒ self
  </code></pre>
  
  <p>通过设置css的属性<code>display</code> 为 <code>none</code>来将Zepto对象集合中的元素隐藏。</p>
  <p>Hide elements in this collection by setting their <code>display</code> CSS property to
    <code>none</code>.</p>
  
</article>

<article class=method id="html">
  <h3>html
    
    
  </h3>
  
  
  <pre class=signature><code>html() ⇒ string
      html(content) ⇒ self
      html(function(index, oldHtml){ ... }) ⇒ self
  </code></pre>
  
  <p>获取或设置Zepto对象集合中元素的HTML内容。当content参数没有给定时，返回IZepto对象集合中第一个元素的innerHtm。当content参数给定时。用其替换Zepto对象集合中每个元素的content。content可以是<a href="#append">append</a>中描述的所有类型。  </p>
  <div class="highlight">
    <pre><code class="js"><span class="c1">// autolink everything that looks like a Twitter username</span>
        <span class="nx">$</span><span class="p">(</span><span class="s1">&#39;.comment p&#39;</span><span class="p">).</span><span class="nx">html</span><span class="p">(</span><span class="kd">function</span><span class="p">(</span><span class="nx">idx</span><span class="p">,</span> <span class="nx">oldHtml</span><span class="p">){</span>
        <span class="k">return</span> <span class="nx">oldHtml</span><span class="p">.</span><span class="nx">replace</span><span class="p">(</span><span class="sr">/(^|\W)@(\w{1,15})/g</span><span class="p">,</span>
        <span class="s1">&#39;$1@&lt;a href=&quot;http://twitter.com/$2&quot;&gt;$2&lt;/a&gt;&#39;</span><span class="p">)</span>
        <span class="p">})</span>
    </code></pre>
  </div>
  
  
  
  
</article>

<article class=method id="index">
  <h3>index
    
    
  </h3>
  
  
  <pre class=signature><code>index([element]) ⇒ number</code></pre>
  
  <p>获取一个元素的位置。当elemen参数没有给出时，返回当前元素在兄弟节点中的位置。当element参数给出时，返回它在当前Zepto对象集合中的位置。如果没有该元素，则返回-1。  </p>
  <div class="highlight">
    <pre><code class="js"><span class="nx">$</span><span class="p">(</span><span class="s1">&#39;li:nth-child(2)&#39;</span><span class="p">).</span><span class="nx">index</span><span class="p">()</span>  <span class="c1">//=&gt; 1</span>
    </code></pre>
  </div>
  
  
  
  
</article>

<article class=method id="indexOf">
  <h3>indexOf
    
    
  </h3>
  
  
  <pre class=signature><code>indexOf(element, [fromIndex]) ⇒ number
  </code></pre>
  
  <p>在当前Zepto中获取一个元素的位置。如果formindex参数给出，从该位置往后查找，返回基于0的位置，如果没找到，则返回-1。<a href="#index">index</a> 方法是基于这个方法实现的。  </p>
  <p class=compat>
    这是一个Zepto的方法，不是jquer的api。</p>
  
  
</article>

<article class=method id="insertAfter">
  <h3>insertAfter
    
    
  </h3>
  
  
  <pre class=signature><code>insertAfter(target) ⇒ self</code></pre>
  
  <p>插入Zepto对象集合中的元素到指定的每个元素后面的dom中。这个有点像 <a href="#after"> after</a>，但是使用方式相反。  </p>
  <div class="highlight">
    <pre><code class="js"><span class="nx">$</span><span class="p">(</span><span class="s1">&#39;&lt;p&gt;Emphasis mine.&lt;/p&gt;&#39;</span><span class="p">).</span><span class="nx">insertAfter</span><span class="p">(</span><span class="s1">&#39;blockquote&#39;</span><span class="p">)</span>
    </code></pre>
  </div>
  
  
  
  
</article>

<article class=method id="insertBefore">
  <h3>insertBefore
    
    
  </h3>
  
  
  <pre class=signature><code>insertBefore(target) ⇒ self</code></pre>
  
  <p>插入Zepto对象集合中的元素到指定的每个元素前面的dom中。这个有点像 <a href="#after"> </a><a href="#before">before</a>，但是使用方式相反。  </p>
  <div class="highlight">
    <pre><code class="js"><span class="nx">$</span><span class="p">(</span><span class="s1">&#39;&lt;p&gt;See the following table:&lt;/p&gt;&#39;</span><span class="p">).</span><span class="nx">insertBefore</span><span class="p">(</span><span class="s1">&#39;table&#39;</span><span class="p">)</span>
    </code></pre>
  </div>
  
  
  
  
</article>

<article class=method id="is">
  <h3>is
    
    
  </h3>
  
  
  <pre class=signature><code>is(selector) ⇒ boolean
  </code></pre>
  
  <p>判断当前Zepto元素集合中的第一个元素是否符css选择器。对于基础支持jquery的非标准选择器类似： <code>:visible</code>包含在可选的“selector”模块中。  </p>
  <p class=compat>
    <a href="http://api.jquery.com/category/selectors/jquery-selector-extensions/">jQuery
      CSS extensions</a> 不被支持。 选择“selector”模块仅仅能支持有限几个最常用的方式。</p>
  
  
  
  
</article>

<article class=method id="last">
  <h3>last
    
    
  </h3>
  
  
  <pre class=signature><code>last() ⇒ collection</code></pre>
  
  <p>获取Zepto集合对象中最后一个元素。  </p>
  <div class="highlight">
    <pre><code class="js"><span class="nx">$</span><span class="p">(</span><span class="s1">&#39;li&#39;</span><span class="p">).</span><span class="nx">last</span><span class="p">()</span>
    </code></pre>
  </div>
  
  
  
  
</article>

<article class=method id="map">
  <h3>map
    
    
  </h3>
  
  
  <pre class=signature><code>map(function(index, item){ ... }) ⇒ collection  </code></pre>
  
  <p>遍历Zepto对象集合中的所有元素。通过遍历函数返回值形成一个新的集合对象。在遍历函数中<code>this</code>关键之指向当前循环的item（遍历函数中的第二个参数）。遍历中返回 <code>null</code>和<code>undefined</code>，遍历将被打断。  </p>
  <div class="highlight">
    <pre><code class="js"><span class="c1">// get text contents of all elements in collection</span>
        <span class="nx">elements</span><span class="p">.</span><span class="nx">map</span><span class="p">(</span><span class="kd">function</span><span class="p">(){</span> <span class="k">return</span> <span class="nx">$</span><span class="p">(</span><span class="k">this</span><span class="p">).</span><span class="nx">text</span><span class="p">()</span> <span class="p">}).</span><span class="nx">get</span><span class="p">().</span><span class="nx">join</span><span class="p">(</span><span class="s1">&#39;, &#39;</span><span class="p">)</span>
    </code></pre>
</div>
  
  
  
  
</article>

<article class=method id="next">
  <h3>next
    
    
  </h3>
  
  
  <pre class=signature><code>next() ⇒ collection
      next(selector) ⇒ collection [v1.0]</code></pre>
  
  <p>获取Zepto对象集合中每一个元素的下一个兄弟节点(可以选择性的带上过滤选择器)。  </p>
  <div class="highlight">
    <pre><code class="js"><span class="nx">$</span><span class="p">(</span><span class="s1">&#39;dl dt&#39;</span><span class="p">).</span><span class="nx">next</span><span class="p">()</span>   <span class="c1">//=&gt; the DD elements</span>
    </code></pre>
  </div>
  
  
  
  
</article>

<article class=method id="not">
  <h3>not
    
    
  </h3>
  
  
  <pre class=signature><code>not(selector) ⇒ collection
      not(collection) ⇒ collection
      not(function(index){ ... }) ⇒ collection
  </code></pre>
  
  <p>过滤当前Zepto对象集合，获取一个新的Zepto对象集合，它里面的元素不能匹配css选择器。如果另一个参数为Zepto集合对象，那么返回的新Zepto对象中的元素都不包含在该参数对象中。如果参数是一个函数。仅仅包含函数执行为false值得时候的元素，函数的 <code>this</code> 关键字指向当前循环元素。</p>
  <p>与它相反的功能，查看 <a href="#filter">filter</a>.</p>
</article>

<article class=method id="offset">
</article>
<article class=method id="offset">
</article>
<article class=method id="offset">
  <h3>offset
    
    
    </h3>
  
  
  <pre class=signature><code>offset() ⇒ object
      offset(coordinates) ⇒ self [v1.0]
      offset(function(index, oldOffset){ ... }) ⇒ self [v1.0]
  </code></pre>
  
  <p>获得当前元素相对于document的位置。返回一个对象含有：
    <code>top</code>, <code>left</code>, <code>width</code>和<code>height</code></p>
  <p>当给定一个对象属性<code>left</code>和<code>top</code>使用这些值来相对于document对每一个元素进行定位。</p>
</article>

<article class=method id="offsetParent">
</article>
<article class=method id="offsetParent">
  <h3>offsetParent
    
    <span class=version>v1.0+</span>
  </h3>
  
  
  <pre class=signature><code>offsetParent() ⇒ collection
  </code></pre>
  
  <p>找到第一个定位过的祖先元素，在ccs中意味着它的<code>position</code> 值为&ldquo;relative&rdquo;, &ldquo;absolute&rdquo; or &ldquo;fixed&rdquo;</p>
</article>

<article class=method id="parent">
</article>
<article class=method id="parent">
  <h3>parent
    
    
  </h3>
  
  
  <pre class=signature><code>parent([selector]) ⇒ collection</code></pre>
  
  <p>获取Zepto对象集合中每个元素的直接父元素。如果css选择器参数给出。过滤出符合条件的元素。</p>
</article>

<article class=method id="parents">
</article>
<article class=method id="parents">
  <h3>parents
    
    
  </h3>
  
  
  <pre class=signature><code>parents([selector]) ⇒ collection</code></pre>
  
  <p>获取Zepto对象集合每个元素所有的祖先元素。如果css选择器参数给出，过滤出符合条件的元素。</p>
  <p>如果想获取直接父级元素，使用 <a href="#parent">parent</a>。如果只想获取到第一个符合css选择器的元素，使用<a href="#closest">closest</a>。  </p>
  <div class="highlight">
    <pre><code class="js"><span class="nx">$</span><span class="p">(</span><span class="s1">&#39;h1&#39;</span><span class="p">).</span><span class="nx">parents</span><span class="p">()</span>   <span class="c1">//=&gt; [&lt;div#container&gt;, &lt;body&gt;, &lt;html&gt;]</span>
    </code></pre>
  </div>
  
  
  
  
</article>

<article class=method id="pluck">
  <h3>pluck
    
    
  </h3>
  
  
  <pre class=signature><code>pluck(property) ⇒ array
  </code></pre>
  
  <p>获取Zepto对象集合中每一个元素的属性值。返回值为 <code>null</code>或<code>undefined</code>值得过滤掉。  </p>
  <div class="highlight">
    <pre><code class="js"><span class="nx">$</span><span class="p">(</span><span class="s1">&#39;body &gt; *&#39;</span><span class="p">).</span><span class="nx">pluck</span><span class="p">(</span><span class="s1">&#39;nodeName&#39;</span><span class="p">)</span> <span class="c1">// =&gt; [&quot;DIV&quot;, &quot;SCRIPT&quot;]</span>

        <span class="c1">// implementation of Zepto&#39;s `next` method</span>
        <span class="nx">$</span><span class="p">.</span><span class="nx">fn</span><span class="p">.</span><span class="nx">next</span> <span class="o">=</span> <span class="kd">function</span><span class="p">(){</span>
        <span class="k">return</span> <span class="nx">$</span><span class="p">(</span><span class="k">this</span><span class="p">.</span><span class="nx">pluck</span><span class="p">(</span><span class="s1">&#39;nextElementSibling&#39;</span><span class="p">))</span>
        <span class="p">}</span>
    </code></pre>
  </div>
  
  
  
  
  <p class=compat>这是一个Zepto的方法，不是jquery的api</p>
  
  
</article>

<article class=method id="position">
  <h3>position
    
    <span class=version>v1.0+</span>
  </h3>
  
  
  <pre class=signature><code>position() ⇒ object
  </code></pre>
  
  <p>获取Zepto对象集合中第一个元素的位置。相对于
    <a href="#offsetParent">offsetParent</a>。当绝对定位的一个素靠近另一个元素的时候，这个方法是有用的。  </p>
  <p>返回一个的对象有这些属性：<code>top</code>, <code>left</code>。  </p>
  <div class="highlight">
    <pre><code class="js"><span class="kd">var</span> <span class="nx">pos</span> <span class="o">=</span> <span class="nx">element</span><span class="p">.</span><span class="nx">position</span><span class="p">()</span>

        <span class="c1">// position a tooltip relative to the element</span>
        <span class="nx">$</span><span class="p">(</span><span class="s1">&#39;#tooltip&#39;</span><span class="p">).</span><span class="nx">css</span><span class="p">({</span>
        <span class="nx">position</span><span class="o">:</span> <span class="s1">&#39;absolute&#39;</span><span class="p">,</span>
        <span class="nx">top</span><span class="o">:</span> <span class="nx">pos</span><span class="p">.</span><span class="nx">top</span> <span class="o">-</span> <span class="mi">30</span><span class="p">,</span>
        <span class="nx">left</span><span class="o">:</span> <span class="nx">pos</span><span class="p">.</span><span class="nx">left</span>
        <span class="p">})</span>
    </code></pre>
  </div>
  
  
  
  
</article>

<article class=method id="prepend">
  <h3>prepend
    
    
  </h3>
  
  
  <pre class=signature><code>prepend(content) ⇒ self
  </code></pre>
  
  <p>将参数内容插入到每个匹配元素的前面（元素内部）。插入d的元素可以试html字符串片段，一个dom节点，或者一个节点的数组。</p>
  <div class="highlight">
    <pre><code class="js"><span class="nx">$</span><span class="p">(</span><span class="s1">&#39;ul&#39;</span><span class="p">).</span><span class="nx">prepend</span><span class="p">(</span><span class="s1">&#39;&lt;li&gt;first list item&lt;/li&gt;&#39;</span><span class="p">)</span>
    </code></pre>
  </div>
  
  
  
  
</article>

<article class=method id="prependTo">
  <h3>prependTo
    
    
  </h3>
  
  
  <pre class=signature><code>prependTo(target) ⇒ self
  </code></pre>
  
  <p>将所有元素插入到目标前面（元素内）。这有点像<a href="#prepend">prepend</a>，但是是相反的方式。  </p>
  <div class="highlight">
    <pre><code class="js"><span class="nx">$</span><span class="p">(</span><span class="s1">&#39;&lt;li&gt;first list item&lt;/li&gt;&#39;</span><span class="p">).</span><span class="nx">prependTo</span><span class="p">(</span><span class="s1">&#39;ul&#39;</span><span class="p">)</span>
    </code></pre>
  </div>
  
  
  
  
</article>

<article class=method id="prev">
  <h3>prev
    
    
  </h3>
  
  
  <pre class=signature><code>prev() ⇒ collection
      prev(selector) ⇒ collection [v1.0]</code></pre>
  
  <p>获取Zepto对象集合中每一个元素的前一个兄弟节点，通过选择器来进行过滤。</p>
</article>

<article class=method id="prop">
</article>
<article class=method id="prop">
  <h3>prop
    
    <span class=version>v1.0+</span>
  </h3>
  
  
  <pre class=signature><code>prop(name) ⇒ value
      prop(name, value) ⇒ self
      prop(name, function(index, oldValue){ ... }) ⇒ self
  </code></pre>
  
  <p>读取或设置dom元素的属性值。它在读取属性值的情况下优先于 <a href="#attr">attr</a>，因为这些属性值会因为用户的交互发生改变，如<code>checked</code> and <code>selected</code>。  </p>
  <div class="highlight">
    <pre>&lt;input class=&quot;taiyang&quot; id=&quot;check1&quot; type=&quot;checkbox&quot; checked=&quot;checked&quot;&gt;<br>&lt;input class=&quot;yaotaiyang&quot; id=&quot;check2&quot; type=&quot;checkbox&quot;&gt;

&lt;script type=&quot;text/javascript&quot;&gt;
	$("#check1").attr("checked"); <code class="js"><span class="c1">//=&gt; &quot;checked&quot;</span></code>
	$("#check1").prop("checked"); <code class="js"><span class="c1">//=&gt; &quot;true&quot;</span></code>
	$("#check2").attr("checked"); <code class="js"><span class="c1">//=&gt; &quot;false&quot;</span></code>
	$("#check2").prop("checked"); <code class="js"><span class="c1">//=&gt; &quot;false&quot;</span></code>
	$("input[type='checkbox']").prop("type",function(index,oldvalue){
		console.log(index+"|"+oldvalue);
	});
	<code class="js"><span class="c1">//=&gt; 0|checkbox</span></code>
	<code class="js"><span class="c1">//=&gt; 1|checkbox</span></code>
	$("input[type='checkbox']").prop("className",function(index,oldvalue){
		console.log(index+"|"+oldvalue);
	});
	<code class="js"><span class="c1">//=&gt; 0|taiyang</span></code>
	<code class="js"><span class="c1">//=&gt; 1|yaotaiyang</span></code>
&lt;/script&gt;</pre>
  </div>
  <p>&nbsp;</p>
  
</article>
<article class=method id="push">
  <h3>push</h3>
  
  
  <pre class=signature><code>push(element, [element2, ...]) ⇒ self
  </code></pre>
  
  <p>添加元素到当前Zepto对象的最后。  </p>
  <p class=compat>
    这是一个zepto的方法，不是jquery的api</p>
  
  
</article>

<article class=method id="ready">
  <h3>ready
    
    
  </h3>
  
  
  <pre class=signature><code>ready(function($){ ... }) ⇒ self</code></pre>
  
  <p>添加一个事件侦听器，当页面dom加载完毕 &ldquo;DOMContentLoaded&rdquo; 事件触发时触发。建议使用 <a href="#$()">$()</a>来代替这种用法。</p>
</article>

<article class=method id="reduce">
</article>
<article class=method id="reduce">
  <h3>reduce
    
    
  </h3>
  
  
  <pre class=signature><code>reduce(function(memo, item, index, array){ ... }, [initial]) ⇒ value
  </code></pre>
  
  <p>与 <a href="https://developer.mozilla.org/en/JavaScript/Reference/Global_Objects/Array/Reduce">Array.reduce</a>有相同的用法，遍历当前Zepto对象集合。memo是函数上次的返回值。迭代进行遍历。  </p>
  <p class=compat>这是一个zepto的方法，不是jquery的api</p>
  
  
  
  
</article>

<article class=method id="remove">
  <h3>remove
    
    
  </h3>
  
  
  <pre class=signature><code>remove() ⇒ self
  </code></pre>
  
  <p>移出当前Zepto对象中的元素。有效的从dom中移除。</p>
</article>

<article class=method id="removeAttr">
</article>
<article class=method id="removeAttr">
  <h3>removeAttr
    
    
  </h3>
  
  
  <pre class=signature><code>removeAttr(name) ⇒ self
  </code></pre>
  
  <p>移动当前Zepto对象集合中所有元素的指定属性。</p>
</article>

<article class=method id="removeClass">
</article>
<article class=method id="removeClass">
  <h3>removeClass
    
    
  </h3>
  
  
  <pre class=signature><code>removeClass([name]) ⇒ self
      removeClass(function(index, oldClassName){ ... }) ⇒ self
  </code></pre>
  
  <p>移动当前Zepto对象集合中所有元素的指定class。如果name参数未给出。将移出所有的class。多个class参数名称可以利用空格分隔。下例移除了两个class。</p>
  <div class="highlight">
    <pre>&lt;input class=&quot;taiyang yueliang&quot; id=&quot;check1&quot; type=&quot;checkbox&quot; checked=&quot;checked&quot;&gt;<br>&lt;input class=&quot;yaotaiyang&quot; id=&quot;check2&quot; type=&quot;checkbox&quot;&gt;

&lt;script type=&quot;text/javascript&quot;&gt;
	$("#check1").removeClass("taiyang yueliang")
	<code class="js"><span class="c1">//=&gt;[&lt;input class id=&quot;check1&quot; type=&quot;checkbox&quot; checked=&quot;checked&quot;&gt;]</span></code><code class="js"><span class="c1"></span></code>
&lt;/script&gt;</pre>
  </div>
</article>

<article class=method id="replaceWith">
</article>
<article class=method id="replaceWith">
  <h3>replaceWith
    
    
  </h3>
  
  
  <pre class=signature><code>replaceWith(content) ⇒ self
  </code></pre>
  
  <p>用提供的内容替换所有匹配的元素。(包含元素本身)。content参数可以为
    <a href="#before">before</a>中描述的类型。</p>
</article>

<article class=method id="scrollTop">
</article>
<article class=method id="scrollTop">
  <h3>scrollTop
    
    <span class=version>v1.0+</span>
  </h3>
  
  
  <pre class=signature><code>scrollTop() ⇒ number
  </code></pre>
  
  <p>获取页面上的滚动元素或者整个窗口已经滚动的像素值。</p>
</article>

<article class=method id="show">
</article>
<article class=method id="show">
  <h3>show
    
    
  </h3>
  
  
  <pre class=signature><code>show() ⇒ self</code></pre>
  
  <p>恢复Zepto对象集合中每个元素默认的“display”值。如果你用 <a href="#hide">hide</a>将元素隐藏，用该属性可以将其显示。相当于干掉了<code>display：none</code>。</p>
</article>

<article class=method id="siblings">
</article>
<article class=method id="siblings">
  <h3>siblings
    
    
  </h3>
  
  
  <pre class=signature><code>siblings([selector]) ⇒ collection
  </code></pre>
  
  <p>获取Zepto集合对象所有统计节点。如果css选择器参数给出。过滤出符合选择器的元素。</p>
</article>

<article class=method id="size">
</article>
<article class=method id="size">
  <h3>size
    
    
  </h3>
  
  
  <pre class=signature><code>size() ⇒ number</code></pre>
  
  <p>获取Zepto对象集合中元素的数量。</p>
</article>

<article class=method id="slice">
</article>
<article class=method id="slice">
  <h3>slice
    
    
  </h3>
  
  
  <pre class=signature><code>slice(start, [end]) ⇒ array</code></pre>
  
  <p><code>array</code>中提取的方法。从<code>start</code>开始，如果<code>end</code> 指出。提取不包含<code>end</code>位置的元素。</p>
</article>

<article class=method id="text">
</article>
<article class=method id="text">
  <h3>text
    
    
  </h3>
  
  
  <pre class=signature><code>text() ⇒ string
      text(content) ⇒ self
  </code></pre>
  
  <p>获取或者设置所有Zepto对象的文本内容。当content参数未给出。返回当前Zepto对象集合中第一个元素的文本内容（包含子节点中的文本内容）。当content参数给出，使用它替换Zepto对象集合中所有元素的文本内容。它有待点似 <a href="#html">html</a>，与它不同的是它不能用来获取或设置	HTML。</p>
</article>

<article class=method id="toggle">
</article>
<article class=method id="toggle">
  <h3>toggle
    
    
  </h3>
  
  
  <pre class=signature><code>toggle([setting]) ⇒ self</code></pre>
  
  <p>显示或隐藏匹配元素。如果 <code>setting</code>为true，相当于<a href="#show">show</a> 法。如果<code>setting</code>为false。相当于 <a href="#hide">hide</a>方法。  </p>
  <div class="highlight">
    <pre><code class="js"><span class="kd">var</span> <span class="nx">input</span> <span class="o">=</span> <span class="nx">$</span><span class="p">(</span><span class="s1">&#39;input[type=text]&#39;</span><span class="p">)</span>
        <span class="nx">$</span><span class="p">(</span><span class="s1">&#39;#too_long&#39;</span><span class="p">).</span><span class="nx">toggle</span><span class="p">(</span><span class="nx">input</span><span class="p">.</span><span class="nx">val</span><span class="p">().</span><span class="nx">length</span> <span class="o">&gt;</span> <span class="mi">140</span><span class="p">)</span>
    </code></pre>
  </div>
  
  
  
  
</article>

<article class=method id="toggleClass">
  <h3>toggleClass
    
    
  </h3>
  
  
  <pre class=signature><code>toggleClass(names, [setting]) ⇒ self
      toggleClass(function(index, oldClassNames){ ... }, [setting]) ⇒ self
  </code></pre>
  
  <p>在匹配的元素集合中的每个元素上添加或删除一个或多个样式类。如果cclass的名称存在则删除它，如果不存在，就添加它。如果 <code>setting</code>的值为真，这个功能类似于 <a href="#addClass">addClass</a>，如果为假，这个功能类似与 <a href="#removeClass">removeClass</a>。</p>
</article>

<article class=method id="unwrap">
</article>
<article class=method id="unwrap">
  <h3>unwrap
    
    
  </h3>
  
  
  <pre class=signature><code>unwrap() ⇒ self</code></pre>
  
  <p>将匹配元素的父级元素删除，保留自身（和兄弟元素，如果存在）在原来的位置。  </p>
  <div class="highlight">
    <pre><code class="js"><span class="nx">$</span><span class="p">(</span><span class="nb">document</span><span class="p">.</span><span class="nx">body</span><span class="p">).</span><span class="nx">append</span><span class="p">(</span><span class="s1">&#39;&lt;div id=wrapper&gt;&lt;p&gt;Content&lt;/p&gt;&lt;/div&gt;&#39;</span><span class="p">)</span>
        <span class="nx">$</span><span class="p">(</span><span class="s1">&#39;#wrapper p&#39;</span><span class="p">).</span><span class="nx">unwrap</span><span class="p">().</span><span class="nx">parents</span><span class="p">()</span>  <span class="c1">//=&gt; [&lt;body&gt;, &lt;html&gt;]</span>
    </code></pre>
  </div>
  
  
  
  
</article>

<article class=method id="val">
  <h3>val
    
    
  </h3>
  
  
  <pre class=signature><code>val() ⇒ string
      val(value) ⇒ self
      val(function(index, oldValue){ ... }) ⇒ self
  </code></pre>
  
  <p>获取或设置比哦单元素的值。当value参数不存在。返回第一个元素的值。如果是<code>&lt;select multiple&gt;</code>标签，则返回一个数组。</p>
</article>

<article class=method id="width">
</article>
<article class=method id="width">
  <h3>width
    
    
  </h3>
  
  
  <pre class=signature><code>width() ⇒ number
      width(value) ⇒ self
      width(function(index, oldWidth){ ... }) ⇒ self</code></pre>
  
  <p>获取Zepto对象集合中第一个元素的宽；或者设置Zepto对象集合所有元素的宽。  </p>
  <div class="highlight">
    <pre><code class="js"><span class="nx">$</span><span class="p">(</span><span class="s1">&#39;#foo&#39;</span><span class="p">).</span><span class="nx">width</span><span class="p">()</span>   <span class="c1">// =&gt; 123</span>
        <span class="nx">$</span><span class="p">(</span><span class="nb">window</span><span class="p">).</span><span class="nx">width</span><span class="p">()</span>   <span class="c1">// =&gt; 768 (viewport width)</span>
        <span class="nx">$</span><span class="p">(</span><span class="nb">document</span><span class="p">).</span><span class="nx">width</span><span class="p">()</span> <span class="c1">// =&gt; 768 </span>
    </code></pre>
  </div>
  
  
  
  
</article>

<article class=method id="wrap">
  <h3>wrap
    
    
  </h3>
  
  
  <pre class=signature><code>wrap(structure) ⇒ self
      wrap(function(index){ ... }) ⇒ self [v1.0]
  </code></pre>
  
  <p>在每个匹配的元素外层包上一个html元素。structure参数可以是一个单独的元素或者一些嵌套的元素。也可以是一个html字符串片段或者dom节点。还可以是一个生成用来包元素的回调函数，这个函数返回前两种类型的包裹片段。  </p>
  <p><strong>需要提醒的是：</strong>该方法对于dom中的节点有着很好的支持。如果将<code>wrap()</code> 用在一个新的元素上，然后再将结果插入到document中，此时该方法无效。  </p>
  <div class="highlight">
    <pre><code class="js"><span class="c1">// wrap each button in a separate span:</span>
        <span class="nx">$</span><span class="p">(</span><span class="s1">&#39;.buttons a&#39;</span><span class="p">).</span><span class="nx">wrap</span><span class="p">(</span><span class="s1">&#39;&lt;span&gt;&#39;</span><span class="p">)</span>

        <span class="c1">// wrap each code block in a div and pre:</span>
        <span class="nx">$</span><span class="p">(</span><span class="s1">&#39;code&#39;</span><span class="p">).</span><span class="nx">wrap</span><span class="p">(</span><span class="s1">&#39;&lt;div class=highlight&gt;&lt;pre /&gt;&lt;/div&gt;&#39;</span><span class="p">)</span>

        <span class="c1">// wrap all form inputs in a span with classname</span>
        <span class="c1">// corresponding to input type:</span>
        <span class="nx">$</span><span class="p">(</span><span class="s1">&#39;input&#39;</span><span class="p">).</span><span class="nx">wrap</span><span class="p">(</span><span class="kd">function</span><span class="p">(</span><span class="nx">index</span><span class="p">){</span>
        <span class="k">return</span> <span class="s1">&#39;&lt;span class=&#39;</span> <span class="o">+</span> <span class="k">this</span><span class="p">.</span><span class="nx">type</span> <span class="o">+</span> <span class="s1">&#39;field /&gt;&#39;</span>
        <span class="p">})</span>
        <span class="c1">//=&gt; &lt;span class=textfield&gt;&lt;input type=text /&gt;&lt;/span&gt;,</span>
        <span class="c1">//   &lt;span class=searchfield&gt;&lt;input type=search /&gt;&lt;/span&gt;</span>

        <span class="c1">// WARNING: will not work as expected!</span>
        <span class="nx">$</span><span class="p">(</span><span class="s1">&#39;&lt;em&gt;broken&lt;/em&gt;&#39;</span><span class="p">).</span><span class="nx">wrap</span><span class="p">(</span><span class="s1">&#39;&lt;li&gt;&#39;</span><span class="p">).</span><span class="nx">appendTo</span><span class="p">(</span><span class="nb">document</span><span class="p">.</span><span class="nx">body</span><span class="p">)</span>
        <span class="c1">// do this instead:</span>
        <span class="nx">$</span><span class="p">(</span><span class="s1">&#39;&lt;em&gt;better&lt;/em&gt;&#39;</span><span class="p">).</span><span class="nx">appendTo</span><span class="p">(</span><span class="nb">document</span><span class="p">.</span><span class="nx">body</span><span class="p">).</span><span class="nx">wrap</span><span class="p">(</span><span class="s1">&#39;&lt;li&gt;&#39;</span><span class="p">)</span>
    </code></pre>
  </div>
  
  
  
  
</article>

<article class=method id="wrapAll">
  <h3>wrapAll
    
    
  </h3>
  
  
  <pre class=signature><code>wrapAll(structure) ⇒ self</code></pre>
  
  <p>在所有匹配元素外面包一层HTML结构。  </p>
  <div class="highlight">
    <pre><code class="js"><span class="c1">// wrap all buttons in a single div:</span>
        <span class="nx">$</span><span class="p">(</span><span class="s1">&#39;a.button&#39;</span><span class="p">).</span><span class="nx">wrap</span><span class="p">(</span><span class="s1">&#39;&lt;div id=buttons /&gt;&#39;</span><span class="p">)</span>
    </code></pre>
  </div>
  
  
  
  
</article>

<article class=method id="wrapInner">
  <h3>wrapInner
    
    
  </h3>
  
  
  <pre class=signature><code>wrapInner(structure) ⇒ self
      wrapInner(function(index){ ... }) ⇒ self [v1.0]
  </code></pre>
  
  <p>在匹配元素里的内容外包一层结构。  </p>
  <div class="highlight">
    <pre>
    <code class="js"><span class="c1">// wrap the contents of each navigation link in a span:</span>
        <span class="nx">$</span><span class="p">(</span><span class="s1">&#39;nav a&#39;</span><span class="p">).</span><span class="nx">wrapInner</span><span class="p">(</span><span class="s1">&#39;&lt;span&gt;&#39;</span><span class="p">)</span>

        <span class="c1">// wrap the contents of each list item in a paragraph and emphasis:</span>
        <span class="nx">$</span><span class="p">(</span><span class="s1">&#39;ol li&#39;</span><span class="p">).</span><span class="nx">wrapInner</span><span class="p">(</span><span class="s1">&#39;&lt;p&gt;&lt;em /&gt;&lt;/p&gt;&#39;</span><span class="p">)</span></code></pre>
   
      <pre><code class="js">以下为原始html：
		&lt;div class=&quot;yaotaiyang&quot;&gt;
			&lt;div class=&quot;taiyang&quot;&gt;yao&lt;/div&gt;
			&lt;div class=&quot;taiyang&quot;&gt;yao&lt;/div&gt;
		&lt;/div&gt;

通过：</code>$('.taiyang).wrapInner('&lt;div class="new" /&gt;');<code class="js">

得到：
		&lt;div class=&quot;yaotaiyang&quot;&gt;
			&lt;div class=&quot;taiyang&quot;&gt;&lt;div class=&quot;new&quot;&gt;yao&lt;/div&gt;&lt;/div&gt;
			&lt;div class=&quot;taiyang&quot;&gt;&lt;div class=&quot;new&quot;&gt;yao&lt;/div&gt;&lt;/div&gt;
		&lt;/div&gt;</code>    </pre>
 
  </div>
  
  
  
  
</article>



<hr>
<h2 id="detect">检测方法</h2>


<article class=method id="Detect module">
  <h3>Detect module
    
    
  </h3>
  <p>&nbsp;</p>
  
  
  <p>该检测方法可以再不同的环境中微调你的站点或者应用程序，并帮助你识别手机和平板；以及不同的浏览器和操作系统。  </p>
  <div class="highlight">
    <pre><code class="js"><span class="c1">// The following boolean flags are set to true if they apply,</span>
        <span class="c1">// if not they&#39;re either set to `false` or `undefined`.</span>
        <span class="c1">// We recommend accessing them with `!!` prefixed to coerce to a boolean. </span>

        <span class="c1">// general device type</span>
        <span class="nx">$</span><span class="p">.</span><span class="nx">os</span><span class="p">.</span><span class="nx">phone</span>
        <span class="nx">$</span><span class="p">.</span><span class="nx">os</span><span class="p">.</span><span class="nx">tablet</span>

        <span class="c1">// specific OS</span>
        <span class="nx">$</span><span class="p">.</span><span class="nx">os</span><span class="p">.</span><span class="nx">ios</span>
        <span class="nx">$</span><span class="p">.</span><span class="nx">os</span><span class="p">.</span><span class="nx">android</span>
        <span class="nx">$</span><span class="p">.</span><span class="nx">os</span><span class="p">.</span><span class="nx">webos</span>
        <span class="nx">$</span><span class="p">.</span><span class="nx">os</span><span class="p">.</span><span class="nx">blackberry</span>
        <span class="nx">$</span><span class="p">.</span><span class="nx">os</span><span class="p">.</span><span class="nx">bb10</span>
        <span class="nx">$</span><span class="p">.</span><span class="nx">os</span><span class="p">.</span><span class="nx">rimtabletos</span>

        <span class="c1">// specific device type</span>
        <span class="nx">$</span><span class="p">.</span><span class="nx">os</span><span class="p">.</span><span class="nx">iphone</span>
        <span class="nx">$</span><span class="p">.</span><span class="nx">os</span><span class="p">.</span><span class="nx">ipad</span>
        <span class="nx">$</span><span class="p">.</span><span class="nx">os</span><span class="p">.</span><span class="nx">touchpad</span>
        <span class="nx">$</span><span class="p">.</span><span class="nx">os</span><span class="p">.</span><span class="nx">kindle</span>

        <span class="c1">// specific browser</span>
        <span class="nx">$</span><span class="p">.</span><span class="nx">browser</span><span class="p">.</span><span class="nx">chrome</span>
        <span class="nx">$</span><span class="p">.</span><span class="nx">browser</span><span class="p">.</span><span class="nx">firefox</span>
        <span class="nx">$</span><span class="p">.</span><span class="nx">browser</span><span class="p">.</span><span class="nx">silk</span>
        <span class="nx">$</span><span class="p">.</span><span class="nx">browser</span><span class="p">.</span><span class="nx">playbook</span>

        <span class="c1">// Additionally, version information is available as well.</span>
        <span class="c1">// Here&#39;s what&#39;s returned for an iPhone running iOS 6.1.</span>
        <span class="o">!!</span><span class="nx">$</span><span class="p">.</span><span class="nx">os</span><span class="p">.</span><span class="nx">phone</span>         <span class="c1">// =&gt; true</span>
        <span class="o">!!</span><span class="nx">$</span><span class="p">.</span><span class="nx">os</span><span class="p">.</span><span class="nx">iphone</span>        <span class="c1">// =&gt; true</span>
        <span class="o">!!</span><span class="nx">$</span><span class="p">.</span><span class="nx">os</span><span class="p">.</span><span class="nx">ios</span>           <span class="c1">// =&gt; true</span>
        <span class="o">!!</span><span class="nx">$</span><span class="p">.</span><span class="nx">os</span><span class="p">.</span><span class="nx">version</span>       <span class="c1">// =&gt; &quot;6.1&quot;</span>
        <span class="o">!!</span><span class="nx">$</span><span class="p">.</span><span class="nx">browser</span><span class="p">.</span><span class="nx">version</span>  <span class="c1">// =&gt; &quot;536.26&quot;</span>
    </code></pre>
  </div>
  
  
</article>



<hr>
<h2 id="event">事件处理</h2>


<article class=method id="$.Event">
  <h3>$.Event
    
    
  </h3>
  
  
  <pre class=signature><code>$.Event(type, [properties]) ⇒ event</code></pre>
  
  <p>创建并初始化一个指定的dom事件。如果properties参数给出，使用它来扩展出新的事件对象。默认情况下，事件被设置为冒泡方式；这个可以通过设置<code>bubbles</code>为<code>false</code>来关闭。  </p>
  <p>初始化的功能可以使用
    <a href="#trigger">trigger</a>来触发。  </p>
  <div class="highlight">
    <pre><code class="js"><span class="nx">$</span><span class="p">.</span><span class="nx">Event</span><span class="p">(</span><span class="s1">&#39;mylib:change&#39;</span><span class="p">,</span> <span class="p">{</span> <span class="nx">bubbles</span><span class="o">:</span> <span class="kc">false</span> <span class="p">})</span>;
    </code></pre>
  </div>
  
  
  
  
</article>

<article class=method id="$.proxy">
  <h3>$.proxy
    
    <span class=version>v1.0+</span>
  </h3>
  
  
  <pre class=signature><code>$.proxy(fn, context) ⇒ function
      $.proxy(context, property) ⇒ function
  </code></pre>
  
  <p>接受一个函数，然后返回一个新函数，并且这个新函数始终保持了特定的上下文语境，新函数中<code>this</code>指向context参数。另外一种形式，原始的function是context对像的方法。  </p>
  <div class="highlight">
    <pre><code class="js"><span class="kd">var</span> <span class="nx">obj</span> <span class="o">=</span> <span class="p">{</span><span class="nx">name</span><span class="o">:</span> <span class="s1">&#39;Zepto&#39;</span><span class="p">},</span>
        <span class="nx">handler</span> <span class="o">=</span> <span class="kd">function</span><span class="p">(){</span> <span class="nx">console</span><span class="p">.</span><span class="nx">log</span><span class="p">(</span><span class="s2">&quot;hello from + &quot;</span><span class="p">,</span> <span class="k">this</span><span class="p">.</span><span class="nx">name</span><span class="p">)</span> <span class="p">}</span>

        <span class="c1">// ensures that the handler will be executed in the context of `obj`:</span>
        <span class="nx">$</span><span class="p">(</span><span class="nb">document</span><span class="p">).</span><span class="nx">on</span><span class="p">(</span><span class="s1">&#39;click&#39;</span><span class="p">,</span> <span class="nx">$</span><span class="p">.</span><span class="nx">proxy</span><span class="p">(</span><span class="nx">handler</span><span class="p">,</span> <span class="nx">obj</span><span class="p">))</span>;

</code><code class="js"><span class="kd">var</span></code> obj = {name: <code class="js"><span class="s1">&quot;yaotaiyang&quot;</span></code>,
		test: <code class="js"><span class="kd">function</span></code>() {
			alert( <code class="js"><span class="k">this</span></code>.name );      
			$(<span class="s1">"#test"</span>).unbind(<span class="s1">"click"</span>, obj.test); 
		}
		};    
$(<span class="s1">"#test"</span>).click( jQuery.proxy( obj, "test" ));<code class="js">
    </code></pre>
  </div>
  
  
  
  
</article>

<article class=method id="bind">
  <h3>bind
    <span class=emoji title=deprecated>🐶🔫</span>
    
  </h3>
  
  <p class=warning>
    Deprecated, use <a href="#on">on</a> instead.
  </p>
  
  
  <pre class=signature><code>bind(type, function(e){ ... }) ⇒ self
      bind({ type: handler, type2: handler2, ... }) ⇒ self
  </code></pre>
  
  <p>为一个元素绑定一个处理事件。</p>
  
</article>

<article class=method id="delegate">
  <h3>delegate
    <span class=emoji title=deprecated>🐶🔫</span>
    
  </h3>
  
  <p class=warning>
    Deprecated, use <a href="#on">on</a> instead.
  </p>
  
  
  <pre class=signature><code>delegate(selector, type, function(e){ ... }) ⇒ self
      delegate(selector, { type: handler, type2: handler2, ... }) ⇒ self
  </code></pre>
  
  <p>基于一组特定的根元素为所有选择器匹配的元素附加一个处理事件，匹配的元素可能现在或将来才创建。</p>
  
</article>

<article class=method id="die">
  <h3>die
    <span class=emoji title=deprecated>🐶🔫</span>
    
  </h3>
  
  <p class=warning>
    Deprecated, use <a href="#off">off</a> instead.
  </p>
  
  
  <pre class=signature><code>die(type, function(e){ ... }) ⇒ self
      die({ type: handler, type2: handler2, ... }) ⇒ self
  </code></pre>
  
  <p>删除通过 <a href="#live">live</a> 添加的事件。</p>
  
</article>

<article class=method id="live">
  <h3>live
    <span class=emoji title=deprecated>🐶🔫</span>
    
  </h3>
  
  <p class=warning>
    Deprecated, use <a href="#on">on</a> instead.
  </p>
  
  
  <pre class=signature><code>live(type, function(e){ ... }) ⇒ self
      live({ type: handler, type2: handler2, ... }) ⇒ self</code></pre>
  
  <p>类似<a href="#delegate">delegate</a>，其中selector参数为当前Zepto集合对象。</p>
</article>

<article class=method id="off">
</article>
<article class=method id="off">
  <h3>off
    
    
  </h3>
  
  
  <pre class=signature><code>off(type, [selector], function(e){ ... }) ⇒ self
      off({ type: handler, type2: handler2, ... }, [selector]) ⇒ self
      off(type, [selector]) ⇒ self
      off() ⇒ self
  </code></pre>
  
  <p>移除通过 <a href="#on">on</a> 注册的事件(用bind或者用on注册的事件)。如果没有参数，将移出当前元素上所有的注册事件。</p>
  <div class="highlight">
    <pre><code>off(type, [selector], function(e){ ... }) ⇒ self

如果selector存在，则相当于delegate。</code>
$("ul").on("click","li",function(){alert("yaotaiyang")});
以上代码相当于将li的事件代理到ul上。后续添加的li也能拥有以上方法。该事件可以通过undelegate来移除。
$("ul").undelegate()；
也可用:$("ul").off();

如果selector参数不存在。则相当于bind。
$(&quot;li&quot;).on(&quot;click&quot;,function(){alert(&quot;yaotaiyang&quot;)});
该事件可以通过unbind来移除。
$(&quot;li&quot;).unbind(&quot;click&quot;);
也可以用off()来移除:$(&quot;li&quot;).off();

on方法继集成bind和delegate方法。</pre>
  </div>
</article>

<article class=method id="on">
</article>
<article class=method id="on">
  <h3>on
    
    
  </h3>
  
  
  <pre class=signature><code>on(type, [selector], function(e){ ... }) ⇒ self
      on({ type: handler, type2: handler2, ... }, [selector]) ⇒ self
  </code></pre>
  
  <p>添加事件到Zepto对象集合上。多个事件可以通过空格的字符串方式添加。或者以事件类型、函数对象的 方式。如果css选择器给出，事件的对象满足选择器条件时。事件才会被触发。  </p>
  <p>事件处理程序在触发事件元素或者css选择器匹配的元素的上下文中执行(this指向触发事件的元素)。</p>
  <p>当事件处理程序返回<code>false</code>, 或调用<code>preventDefault()</code>，浏览器的默认事件将会被阻止。  </p>
  <div class="highlight">
    <pre><code class="js"><span class="kd">var</span> <span class="nx">elem</span> <span class="o">=</span> <span class="nx">$</span><span class="p">(</span><span class="s1">&#39;#content&#39;</span><span class="p">)</span>
        <span class="c1">// observe all clicks inside #content:</span>
        <span class="nx">elem</span><span class="p">.</span><span class="nx">on</span><span class="p">(</span><span class="s1">&#39;click&#39;</span><span class="p">,</span> <span class="kd">function</span><span class="p">(</span><span class="nx">e</span><span class="p">){</span> <span class="p">...</span> <span class="p">})</span>
        <span class="c1">// observe clicks inside navigation links in #content</span>
        <span class="nx">elem</span><span class="p">.</span><span class="nx">on</span><span class="p">(</span><span class="s1">&#39;click&#39;</span><span class="p">,</span> <span class="s1">&#39;nav a&#39;</span><span class="p">,</span> <span class="kd">function</span><span class="p">(</span><span class="nx">e</span><span class="p">){</span> <span class="p">...</span> <span class="p">})</span>
        <span class="c1">// all clicks inside links in the document</span>
        <span class="nx">$</span><span class="p">(</span><span class="nb">document</span><span class="p">).</span><span class="nx">on</span><span class="p">(</span><span class="s1">&#39;click&#39;</span><span class="p">,</span> <span class="s1">&#39;a&#39;</span><span class="p">,</span> <span class="kd">function</span><span class="p">(</span><span class="nx">e</span><span class="p">){</span> <span class="p">...</span> <span class="p">})</span>
    </code></pre>
    
    <pre><code>on(type, [selector], function(e){ ... }) ⇒ self

如果selector存在，则相当于delegate。</code>
$("ul").on("click","li",function(){alert("yaotaiyang")});
以上代码相当于将li的事件代理到ul上。后续添加的li也能拥有以上方法。该事件可以通过undelegate来移除。
$("ul").undelegate()；
也可用:$("ul").off();

如果selector参数不存在。则相当于bind。
$(&quot;li&quot;).on(&quot;click&quot;,function(){alert(&quot;yaotaiyang&quot;)});
该事件可以通过unbind来移除。
$(&quot;li&quot;).unbind(&quot;click&quot;);
也可以用off()来移除:$(&quot;li&quot;).off();

on方法继集成bind和delegate方法。</pre>
  </div>
  
  
  
  
</article>

<article class=method id="one">
  <h3>one
    
    
  </h3>
  
  
  <pre class=signature><code>one(type, function(e){ ... }) ⇒ self
      one({ type: handler, type2: handler2, ... }) ⇒ self
  </code></pre>
  
  <p>添加一个处理事件到元素。处理函数在每个元素上最多执行一次。</p>
</article>

<article class=method id="trigger">
</article>
<article class=method id="trigger">
  <h3>trigger
    
    
  </h3>
  
  
  <pre class=signature><code>trigger(event, [data])
  </code></pre>
  
  <p>在Zepto对象集合的元素上触发指定的事件。事件可以是一个字符串，也可以是一个 <a href="#$.Event">$.Event</a> 对象。如果data参数存在，它会作为参数传递给事件函数。  </p>
  <div class="highlight">
    <pre><code class="js"><span class="c1">// add a handler for a custom event</span>
        <span class="nx">$</span><span class="p">(</span><span class="nb">document</span><span class="p">).</span><span class="nx">on</span><span class="p">(</span><span class="s1">&#39;mylib:change&#39;</span><span class="p">,</span> <span class="kd">function</span><span class="p">(</span><span class="nx">e</span><span class="p">,</span> <span class="nx">from</span><span class="p">,</span> <span class="nx">to</span><span class="p">){</span>
        <span class="nx">console</span><span class="p">.</span><span class="nx">log</span><span class="p">(</span><span class="s1">&#39;change on %o with data %s, %s&#39;</span><span class="p">,</span> <span class="nx">e</span><span class="p">.</span><span class="nx">target</span><span class="p">,</span> <span class="nx">from</span><span class="p">,</span> <span class="nx">to</span><span class="p">)</span>
        <span class="p">})</span>
        <span class="c1">// trigger the custom event</span>
        <span class="nx">$</span><span class="p">(</span><span class="nb">document</span><span class="p">.</span><span class="nx">body</span><span class="p">).</span><span class="nx">trigger</span><span class="p">(</span><span class="s1">&#39;mylib:change&#39;</span><span class="p">,</span> <span class="p">[</span><span class="s1">&#39;one&#39;</span><span class="p">,</span> <span class="s1">&#39;two&#39;</span><span class="p">])</span>
    </code></pre>
  </div>
  
  
  
  
  <p class=compat>
    Zepto仅仅支持在dom元素上触发事件。</p>
  
  
</article>

<article class=method id="triggerHandler">
  <h3>triggerHandler
    
    
  </h3>
  
  
  <pre class=signature><code>triggerHandler(event, [data]) ⇒ self</code></pre>
  
  <p>像 <a href="#trigger">trigger</a>，它只触发事件，但不冒泡。</p>
  <p>比如你再一个input上如果使用该方法。</p>
  <div class="highlight">
    <pre><code class="js">		<span class="nx">$</span><span class="p">(</span><span class="nb">&quot;input&quot;</span><span class="p">).</span><span class="nx">triggerHandler</span><span class="p">(</span><span class="s1">&#39;focus&#39;</span><span class="p"></span><span class="p">)</span>;
        <span class="c1">// 此时input上的focus事件触发，但是input不会聚焦</span><span class="nx">
		$</span><span class="p">(</span><span class="nb">&quot;input&quot;</span><span class="p">).</span><span class="nx">trigger</span><span class="p">(</span><span class="s1">&#39;focus&#39;</span><span class="p"></span><span class="p">)</span>;
        <span class="c1">// 此时input上的focus事件触发，input聚焦</span></code></pre>
  </div>
</article>

<article class=method id="unbind">
</article>
<article class=method id="unbind">
  <h3>unbind
    <span class=emoji title=deprecated>🐶🔫</span>
    
  </h3>
  
  <p class=warning>
    Deprecated, use <a href="#off">off</a> instead.
  </p>
  
  
  <pre class=signature><code>unbind(type, function(e){ ... }) ⇒ self
      unbind({ type: handler, type2: handler2, ... }) ⇒ self
  </code></pre>
  
  <p>移除通过 <a href="#bind">bind</a> 注册的事件。</p>
  
</article>

<article class=method id="undelegate">
  <h3>undelegate
    <span class=emoji title=deprecated>🐶🔫</span>
    
  </h3>
  
  <p class=warning>
    Deprecated, use <a href="#off">off</a> instead.
  </p>
  
  
  <pre class=signature><code>undelegate(selector, type, function(e){ ... }) ⇒ self
      undelegate(selector, { type: handler, type2: handler2, ... }) ⇒ self</code></pre>
  
  <p>移除通过<a href="#delegate">delegate</a> 注册的事件。</p>
</article>



<hr>
<h2 id="ajax">Ajax请求</h2>


<article class=method id="$.ajax">
  <h3>$.ajax
    
    
  </h3>
  
  
  <pre class=signature><code>$.ajax(options) ⇒ XMLHttpRequest </code></pre>
  
  <p>执行Ajax请求。请求地址可以是本地的或者跨域的，在支持的浏览器中通过
    <a href="https://developer.mozilla.org/en/http_access_control">HTTP access control</a>或者通过 <a href="http://json-p.org">JSONP</a>来完成。  </p>
  <p>参数:</p>
  
  <ul>
    <li><code>type</code> (默认： &ldquo;GET&rdquo;)：请求方法 (&ldquo;GET&rdquo;, &ldquo;POST&rdquo;, or other)</li>
    <li><code>url</code> (默认：  当前地址)：发送请求的地址</li>
    <li><code>data</code> (默认：none)：发送到服务器的数据；如果是get请求，它会自动被作为参数拼接到url上。非String对象将通过
      <a href="#$.param">$.param</a> 得到序列化字符串。</li>
    <li><code>processData</code> (默认： true)： 对于非Get请求。是否自动将 <code>data</code> 转换为字符串。</li>
    <li><code>contentType</code> (默认： &ldquo;application/x-www-form-urlencoded&rdquo;)： 发送信息至服务器时内容编码类型。 (这也可以通过设置headers <code>headers</code>)。通过设置 <code>false</code> 跳过设置默认值。</li>
    <li><code>dataType</code> (默认： none)：预期服务器返回的数据类型(&ldquo;json&rdquo;, &ldquo;jsonp&rdquo;, &ldquo;xml&rdquo;, &ldquo;html&rdquo;, or &ldquo;text&rdquo;)</li>
    <li><code>timeout</code> (默认： <code>0</code>)： 设置请求超时时间（毫秒），<code>0</code>表示不超时。</li>
    <li><code>headers</code> (默认：<code>{}</code>)： 一个额外的"{键:值}"对映射到请求一起发送</li>
    <li><code>async</code> (默认： true)：默认设置下，所有请求均为异步。如果需发送同步请求，请将此设置为 <code>false</code>。</li>
    <li><code>global</code> (默认： true)：请求将触发全局AJAX事件处理程序，设置为 false 将不会触发全局 AJAX 事件。</li>
    <li><code>context</code> (默认： window)： 这个对象用于设置Ajax相关回调函数的上下文(this指向)。</li>
    <li><code>traditional</code> (默认：false)：激活传统的方式通过<a href="#$.param">$.param</a>来得到序列化的 <code>data</code>。</li>
  </ul>
  
  
  <p>如果URL中含有 <code>=?</code>或者<code>dataType</code>是&ldquo;jsonp&rdquo;，这讲求将会通过注入一个 <code>&lt;script&gt;</code>标签来代替使用 XMLHttpRequest (查看 <a href="http://json-p.org">JSONP</a>)。此时对 <code>contentType</code>, <code>dataType</code>, <code>headers</code>有限制，<code>async</code> 不被支持。  </p>
  <h4>Ajax 回调函数</h4>
  
  <p>你可以指定以下的回调函数，给出的执行顺序：  </p>
  <ol>
    <li>
      <p><code>beforeSend(xhr, settings)</code>：请求发出前调用，它接收xhr对象和settings作为参数对象。如果它返回 <code>false</code> ，请求将被取消。</p>
      </li>
    <li>
      <p><code>success(data, status, xhr)</code>：请求成功之后调用。传入返回后的数据，以及包含成功代码的字符串。</p>
      </li>
    <li>
      <p><code>error(xhr, errorType, error)</code>：请求出错时调用。 (超时，解析错误，或者状态码不在HTTP 2xx)。</p>
      </li>
    <li>
      <p><code>complete(xhr, status)</code>：请求完成时调用，无论请求失败或成功。</p>
      </li>
  </ol>
  
  
  <h4>Ajax 事件</h4>
  
  <p>当<code>global: true</code>时。在Ajax请求生命周期内，以下这些事件将被触发。  </p>
  <ol>
    <li>
      <p><code>ajaxStart</code> <i>(global)</i>：如果没有其他Ajax请求当前活跃将会被触发。</p>
      </li>
    <li>
      <p><code>ajaxBeforeSend</code> (data: xhr, options)：再发送请求前，可以被取消。</p>
      </li>
    <li>
      <p><code>ajaxSend</code> (data: xhr, options)：像 <code>ajaxBeforeSend</code>，但不能取消。</p>
      </li>
    <li>
      <p><code>ajaxSuccess</code> (data: xhr, options, data)：当返回成功时。</p>
      </li>
    <li>
      <p><code>ajaxError</code> (data: xhr, options, error)：当有错误时。</p>
      </li>
    <li>
      <p><code>ajaxComplete</code> (data: xhr, options)：请求已经完成后，无论请求是成功或者失败。</p>
      </li>
    <li>
      <p><code>ajaxStop</code> <i>(global)</i>：如果这是最后一个活跃着的Ajax请求，将会被触发。</p>
      </li>
  </ol>
  
  
  <p>默认情况下，Ajax事件在document对象上触发。然而，如果请求的 
    <code>context</code> 是一个dom节点，该事件会在此节点上触发然后再dom中冒泡。唯一的例外是 <code>ajaxStart</code> &amp; <code>ajaxStop</code>这两个全局事件。  </p>
  <div class="highlight">
    <pre><code class="js"><span class="nx">$</span><span class="p">(</span><span class="nb">document</span><span class="p">).</span><span class="nx">on</span><span class="p">(</span><span class="s1">&#39;ajaxBeforeSend&#39;</span><span class="p">,</span> <span class="kd">function</span><span class="p">(</span><span class="nx">e</span><span class="p">,</span> <span class="nx">xhr</span><span class="p">,</span> <span class="nx">options</span><span class="p">){</span>
        <span class="c1">// This gets fired for every Ajax request performed on the page.</span>
        <span class="c1">// The xhr object and $.ajax() options are available for editing.</span>
        <span class="c1">// Return false to cancel this request.</span>
        <span class="p">})</span>

        <span class="nx">$</span><span class="p">.</span><span class="nx">ajax</span><span class="p">({</span>
        <span class="nx">type</span><span class="o">:</span> <span class="s1">&#39;GET&#39;</span><span class="p">,</span>
        <span class="nx">url</span><span class="o">:</span> <span class="s1">&#39;/projects&#39;</span><span class="p">,</span>
        <span class="c1">// data to be added to query string:</span>
        <span class="nx">data</span><span class="o">:</span> <span class="p">{</span> <span class="nx">name</span><span class="o">:</span> <span class="s1">&#39;Zepto.js&#39;</span> <span class="p">},</span>
        <span class="c1">// type of data we are expecting in return:</span>
        <span class="nx">dataType</span><span class="o">:</span> <span class="s1">&#39;json&#39;</span><span class="p">,</span>
        <span class="nx">timeout</span><span class="o">:</span> <span class="mi">300</span><span class="p">,</span>
        <span class="nx">context</span><span class="o">:</span> <span class="nx">$</span><span class="p">(</span><span class="s1">&#39;body&#39;</span><span class="p">),</span>
        <span class="nx">success</span><span class="o">:</span> <span class="kd">function</span><span class="p">(</span><span class="nx">data</span><span class="p">){</span>
        <span class="c1">// Supposing this JSON payload was received:</span>
        <span class="c1">//   {&quot;project&quot;: {&quot;id&quot;: 42, &quot;html&quot;: &quot;&lt;div&gt;...&quot; }}</span>
        <span class="c1">// append the HTML to context object.</span>
        <span class="k">this</span><span class="p">.</span><span class="nx">append</span><span class="p">(</span><span class="nx">data</span><span class="p">.</span><span class="nx">project</span><span class="p">.</span><span class="nx">html</span><span class="p">)</span>
        <span class="p">},</span>
        <span class="nx">error</span><span class="o">:</span> <span class="kd">function</span><span class="p">(</span><span class="nx">xhr</span><span class="p">,</span> <span class="nx">type</span><span class="p">){</span>
        <span class="nx">alert</span><span class="p">(</span><span class="s1">&#39;Ajax error!&#39;</span><span class="p">)</span>
        <span class="p">}</span>
        <span class="p">})</span>

        <span class="c1">// post a JSON payload:</span>
        <span class="nx">$</span><span class="p">.</span><span class="nx">ajax</span><span class="p">({</span>
        <span class="nx">type</span><span class="o">:</span> <span class="s1">&#39;POST&#39;</span><span class="p">,</span>
        <span class="nx">url</span><span class="o">:</span> <span class="s1">&#39;/projects&#39;</span><span class="p">,</span>
        <span class="c1">// post payload:</span>
        <span class="nx">data</span><span class="o">:</span> <span class="nx">JSON</span><span class="p">.</span><span class="nx">stringify</span><span class="p">({</span> <span class="nx">name</span><span class="o">:</span> <span class="s1">&#39;Zepto.js&#39;</span> <span class="p">}),</span>
        <span class="nx">contentType</span><span class="o">:</span> <span class="s1">&#39;application/json&#39;</span>
        <span class="p">})</span>
    </code></pre>
  </div>
  
  
  
  
</article>

<article class=method id="$.ajaxJSONP">
  <h3>$.ajaxJSONP
    <span class=emoji title=deprecated>🐶🔫</span>
    
  </h3>
  
  <p class=warning>
    Deprecated, use <a href="#$.ajax">$.ajax</a> instead.
  </p>
  
  
  <pre class=signature><code>$.ajaxJSONP(options) ⇒ mock XMLHttpRequest
  </code></pre>
  
  <p>执行JSONP跨域获取数据。  </p>
  <p>此方法相对 <a href="#$.ajax">$.ajax</a> 没有优势，建议不要使用。</p>
</article>

<article class=method id="$.ajaxSettings">
</article>
<article class=method id="$.ajaxSettings">
  <h3>$.ajaxSettings
    
    
  </h3>
  
  
  <p>一个包含Ajax请求的默认设置的对象。大部分的设置在 <a href="#$.ajax">$.ajax</a>中已经描述。以下设置为全局非常有用：</p>
  <p>Object containing the default settings for Ajax requests. Most settings are
    described in <a href="#$.ajax">$.ajax</a>. The ones that are useful when set globally are:</p>
  
  <ul>
    <li><code>timeout</code> (默认： <code>0</code>)：对Ajax请求设置一个非零的值指定一个默认的超时时间，以毫秒为单位。</li>
    <li><code>global</code> (默认： true)：设置为false。以防止触发Ajax事件。</li>
    <li><code>xhr</code> (默认：XMLHttpRequest factory)：设置为一个函数，它返回XMLHttpRequest实例(或一个兼容的对象)</li>
    <li><code>accepts</code>: 从服务器请求的MIME类型，指定<code>dataType</code>值：
      
        <ul>
          <li>script: &ldquo;text/javascript, application/javascript&rdquo;</li>
        <li>json:   &ldquo;application/json&rdquo;</li>
        <li>xml:    &ldquo;application/xml, text/xml&rdquo;</li>
        <li>html:   &ldquo;text/html&rdquo;</li>
        <li>text:   &ldquo;text/plain&rdquo;</li>
    </ul>
    </li>
  </ul>
  
  
</article>

<article class=method id="$.get">
  <h3>$.get
    
    
  </h3>
  
  
  <pre class=signature><code>$.get(url, function(data, status, xhr){ ... }) ⇒ XMLHttpRequest
      $.get(url, [data], [function(data, status, xhr){ ... }], [dataType]) ⇒ XMLHttpRequest [v1.0]
  </code></pre>
  
  <p>执行一个Ajax GET请求。这是一个 <a href="#$.ajax">$.ajax</a>的简写方式。  </p>
  <div class="highlight">
    <pre><code class="js"><span class="nx">$</span><span class="p">.</span><span class="nx">get</span><span class="p">(</span><span class="s1">&#39;/whatevs.html&#39;</span><span class="p">,</span> <span class="kd">function</span><span class="p">(</span><span class="nx">response</span><span class="p">){</span>
        <span class="nx">$</span><span class="p">(</span><span class="nb">document</span><span class="p">.</span><span class="nx">body</span><span class="p">).</span><span class="nx">append</span><span class="p">(</span><span class="nx">response</span><span class="p">)</span>
        <span class="p">})</span>
    </code></pre>
  </div>
  
  
  
  
</article>

<article class=method id="$.getJSON">
  <h3>$.getJSON
    
    
  </h3>
  
  
  <pre class=signature><code>$.getJSON(url, function(data, status, xhr){ ... }) ⇒ XMLHttpRequest
      $.getJSON(url, [data], function(data, status, xhr){ ... }) ⇒ XMLHttpRequest [v1.0]
  </code></pre>
  
  <p>通过 Ajax GET请求获取JSON数据。这是一个 <a href="#$.ajax">$.ajax</a> 的简写方式。  </p>
  <div class="highlight">
    <pre><code class="js"><span class="nx">$</span><span class="p">.</span><span class="nx">getJSON</span><span class="p">(</span><span class="s1">&#39;/awesome.json&#39;</span><span class="p">,</span> <span class="kd">function</span><span class="p">(</span><span class="nx">data</span><span class="p">){</span>
        <span class="nx">console</span><span class="p">.</span><span class="nx">log</span><span class="p">(</span><span class="nx">data</span><span class="p">)</span>
        <span class="p">})</span>

        <span class="c1">// fetch data from another domain with JSONP</span>
        <span class="nx">$</span><span class="p">.</span><span class="nx">getJSON</span><span class="p">(</span><span class="s1">&#39;//example.com/awesome.json?callback=?&#39;</span><span class="p">,</span> <span class="kd">function</span><span class="p">(</span><span class="nx">remoteData</span><span class="p">){</span>
        <span class="nx">console</span><span class="p">.</span><span class="nx">log</span><span class="p">(</span><span class="nx">remoteData</span><span class="p">)</span>
        <span class="p">})</span>
    </code></pre>
  </div>
  
  
  
  
</article>

<article class=method id="$.param">
  <h3>$.param
    
    
  </h3>
  
  
  <pre class=signature><code>$.param(object, [shallow]) ⇒ string
      $.param(array) ⇒ string
  </code></pre>
  
  <p>创建一个序列化的数组或对象，适用于一个URL 地址查询字符串或Ajax请求。如果shallow设置为true。嵌套对象不会被序列化，嵌套数组的值不会使用放括号在他们的key上。  </p>
  <p>此外，还接受 <a href="#serializeArray">serializeArray</a>格式的数组，其中每个项都有 &ldquo;name&rdquo; 和 &ldquo;value&rdquo;属性。</p>
  <p>Also accepts an array in <a href="#serializeArray">serializeArray</a> format, where each
    item has &ldquo;name&rdquo; and &ldquo;value&rdquo; properties.</p>
  
  <div class="highlight">
    <pre><code class="js"><span class="nx">$</span><span class="p">.</span><span class="nx">param</span><span class="p">({</span> <span class="nx">foo</span><span class="o">:</span> <span class="p">{</span> <span class="nx">one</span><span class="o">:</span> <span class="mi">1</span><span class="p">,</span> <span class="nx">two</span><span class="o">:</span> <span class="mi">2</span> <span class="p">}})</span>
        <span class="c1">//=&gt; &quot;foo[one]=1&amp;foo[two]=2)&quot;</span>

        <span class="nx">$</span><span class="p">.</span><span class="nx">param</span><span class="p">({</span> <span class="nx">ids</span><span class="o">:</span> <span class="p">[</span><span class="mi">1</span><span class="p">,</span><span class="mi">2</span><span class="p">,</span><span class="mi">3</span><span class="p">]</span> <span class="p">})</span>
        <span class="c1">//=&gt; &quot;ids[]=1&amp;ids[]=2&amp;ids[]=3&quot;</span>

        <span class="nx">$</span><span class="p">.</span><span class="nx">param</span><span class="p">({</span> <span class="nx">ids</span><span class="o">:</span> <span class="p">[</span><span class="mi">1</span><span class="p">,</span><span class="mi">2</span><span class="p">,</span><span class="mi">3</span><span class="p">]</span> <span class="p">},</span> <span class="kc">true</span><span class="p">)</span>
        <span class="c1">//=&gt; &quot;ids=1&amp;ids=2&amp;ids=3&quot;</span>

        <span class="nx">$</span><span class="p">.</span><span class="nx">param</span><span class="p">({</span> <span class="nx">foo</span><span class="o">:</span> <span class="s1">&#39;bar&#39;</span><span class="p">,</span> <span class="nx">nested</span><span class="o">:</span> <span class="p">{</span> <span class="nx">will</span><span class="o">:</span> <span class="s1">&#39;not be ignored&#39;</span> <span class="p">}})</span>
        <span class="c1">//=&gt; &quot;foo=bar&amp;nested[will]=not+be+ignored&quot;</span>

        <span class="nx">$</span><span class="p">.</span><span class="nx">param</span><span class="p">({</span> <span class="nx">foo</span><span class="o">:</span> <span class="s1">&#39;bar&#39;</span><span class="p">,</span> <span class="nx">nested</span><span class="o">:</span> <span class="p">{</span> <span class="nx">will</span><span class="o">:</span> <span class="s1">&#39;be ignored&#39;</span> <span class="p">}},</span> <span class="kc">true</span><span class="p">)</span>
        <span class="c1">//=&gt; &quot;foo=bar&amp;nested=[object+Object]&quot;</span>
    </code></pre>
  </div>
  
  
  
  
</article>

<article class=method id="$.post">
  <h3>$.post
    
    
  </h3>
  
  
  <pre class=signature><code>$.post(url, [data], function(data, status, xhr){ ... }, [dataType]) ⇒ XMLHttpRequest
  </code></pre>
  
  <p>执行Ajax POST请求。这是一个 <a href="#$.ajax">$.ajax</a> 的简写方式。  </p>
  <div class="highlight">
    <pre><code class="js"><span class="nx">$</span><span class="p">.</span><span class="nx">post</span><span class="p">(</span><span class="s1">&#39;/create&#39;</span><span class="p">,</span> <span class="p">{</span> <span class="nx">sample</span><span class="o">:</span> <span class="s1">&#39;payload&#39;</span> <span class="p">},</span> <span class="kd">function</span><span class="p">(</span><span class="nx">response</span><span class="p">){</span>
        <span class="c1">// process response</span>
        <span class="p">})</span>
    </code></pre>
  </div>
  
  
  <p><code>data</code> 参数可以是一个字符串：</p>
  
  <div class="highlight">
    <pre><code class="js"><span class="nx">$</span><span class="p">.</span><span class="nx">post</span><span class="p">(</span><span class="s1">&#39;/create&#39;</span><span class="p">,</span> <span class="nx">$</span><span class="p">(</span><span class="s1">&#39;#some_form&#39;</span><span class="p">).</span><span class="nx">serialize</span><span class="p">(),</span> <span class="kd">function</span><span class="p">(</span><span class="nx">response</span><span class="p">){</span>
        <span class="c1">// ...</span>
        <span class="p">})</span>
    </code></pre>
  </div>
  
  
  
  
</article>

<article class=method id="load">
  <h3>load
    
    
  </h3>
  
  
  <pre class=signature><code>load(url, function(data, status, xhr){ ... }) ⇒ self
  </code></pre>
  
  <p>通过GET Ajax载入远程 HTML 文件代码并插入至 DOM 中。另外，一个css选择器可以在url中指定，像这样，可以使用匹配selector选择器的HTML内容来更新集合。</p>
  <p>Set the html contents of the current collection to the result of a GET Ajax call to the given URL. Optionally, a CSS selector can be specified in the URL, like so, to use only the HTML content matching the selector for updating the collection:</p>
  
  <div class="highlight">
    <pre><code class="js"><span class="nx">$</span><span class="p">(</span><span class="s1">&#39;#some_element&#39;</span><span class="p">).</span><span class="nx">load</span><span class="p">(</span><span class="s1">&#39;/foo.html #bar&#39;</span><span class="p">)</span>
    </code></pre>
  </div>
  
  
  <p>当这种方法执行, 它将检索 <code class="js"><span class="s1">foo.html</span></code> 页面的内容，Zepto会获取ID为bar元素的内容，并且插入到ID为 some_element 元素，而其他的被检索到的元素将被废弃。</p>
  <p>如果css选择器不存在。将使用完整的返回文本。</p>
  <p>请注意，在没有选择器的情况下，任何javascript块都会执行。如果带上选择器，匹配选择器内的script将会被删除。</p>
</article>



<hr>
<h2 id="form">表单方法</h2>


<article class=method id="serialize">
  <h3>serialize
    
    
  </h3>
  
  
  <pre class=signature><code>serialize() ⇒ string
  </code></pre>
  
  <p>在Ajax post请求中将用作提交的表单元素的值编译成 URL-encoded 字符串。</p>
  
</article>

<article class=method id="serializeArray">
  <h3>serializeArray
    
    
  </h3>
  
  
  <pre class=signature><code>serializeArray() ⇒ array</code></pre>
  
  <p>将用作提交的表单元素的值编译成拥有name和value对象组成的数组。不能使用的表单元素，buttons，未选中的radio buttons/checkboxs 将会被跳过。结果不包含file inputs的数据。</p>
  <div class="highlight">
    <pre><code class="js"><span class="nx">$</span><span class="p">(</span><span class="s1">&#39;form&#39;</span><span class="p">).</span><span class="nx">serializeArray</span><span class="p">()</span>
        <span class="c1">//=&gt; [{ name: &#39;size&#39;, value: &#39;micro&#39; },</span>
        <span class="c1">//    { name: &#39;name&#39;, value: &#39;Zepto&#39; }]</span>
    </code></pre>
  </div>
  
  
  
  
</article>

<article class=method id="submit">
  <h3>submit
    
    
  </h3>
  
  
  <pre class=signature><code>submit() ⇒ self
      submit(function(e){ ... }) ⇒ self
  </code></pre>
  
  <p>为 "submit" 事件绑定一个处理函数，或者触发元素上的 "submit" 事件。当参数function没有给出时，触发当前表单“submit”事件，并且执行默认的提交表单行为，除非调用了 <code>preventDefault()</code>。</p>
  <p>当function参数给出时，在当前元素上它简单得为其在“submit”事件绑定一个处理函数。</p>
  <p>&nbsp;</p>
</article>
<hr>
<h2 id="fx">效果</h2>


<article class=method id="$.fx">
  <h3>$.fx
    
    
  </h3>
  
  
  <p>全局动画设置：</p>
  
  <ul>
    <li>
      <p><code>$.fx.off</code> (在支持css transition 的浏览器中默认为false)：设置true来禁止所有<a href="#animate"><code>animate()</code></a> transitions。</p>
    </li>
    <li>
      <p><code>$.fx.speeds</code>：用来设置动画时间的对象。</p>
      
      <ul>
        <li><code>_default</code> (400 ms)</li>
        <li><code>fast</code> (200 ms)</li>
        <li><code>slow</code> (600 ms)</li>
      </ul>
      
      
      <p>&nbsp;</p>
      改变现有值或者添加一个新属性去影响使用一个字符串来设置时间的动画。
      <p>Change existing values or add new properties to affect animations that use
        a string for setting duration.</p>
    </li>
  </ul>
  
  
</article>

<article class=method id="animate">
  <h3>animate
    
    
  </h3>
  
  
  <pre class=signature><code>animate(properties, [duration, [easing, [function(){ ... }]]]) ⇒ self
      animate(properties, { duration: msec, easing: type, complete: fn }) ⇒ self
      animate(animationName, { ... }) ⇒ self
  </code></pre>
  
  <p>对当前Zepto集合对象中元素进行css transition属性平滑过渡。  </p>
  <ul>
    <li><code>properties</code>: 一个对象，该对象包含了css动画的值，或者css帧动画的名称。</li>
    <li><code>duration</code> (默认 400)：以毫秒为单位的时间，或者一个字符串。
      
      <ul>
        <li><code>fast</code> (200 ms)</li>
        <li><code>slow</code> (600 ms)</li>
        <li>任何<a href="#$.fx"><code>$.fx.speeds</code></a>自定义属性</li>
      </ul>
      </li>
    <li><code>easing</code> (默认 <code>linear</code>)：指定动画的缓动类型，使用以下一个：
      
      <ul>
        <li><code>ease</code></li>
        <li><code>linear</code></li>
        <li><code>ease-in</code> / <code>ease-out</code></li>
        <li><code>ease-in-out</code></li>
        <li><a href="http://www.w3.org/TR/css3-transitions/#transition-timing-function_tag"><code>cubic-bezier(...)</code></a></li>
      </ul>
      </li>
    <li><code>complete</code>：动画完成时的回调函数</li>
</ul>
  
  
  <p>Zepto 还支持以下 <a href="http://www.w3.org/TR/css3-transforms/#transform-functions">CSS transform</a> 属性：</p>
  
  <ul>
    <li><code>translate(X|Y|Z|3d)</code></li>
    <li><code>rotate(X|Y|Z|3d)</code></li>
    <li><code>scale(X|Y|Z)</code></li>
    <li><code>matrix(3d)</code></li>
    <li><code>perspective</code></li>
    <li><code>skew(X|Y)</code></li>
  </ul>
  
  
  <p>如果duration参数为 <code>0</code> 或 <code>$.fx.off</code> 为 true(在不支持css transitions的浏览器中默认为true)，动画将不被执行；替代动画效果的目标位置会即刻生效。类似的，如果指定的动画不是通过动画完成，而且动画的目标位置即可生效。这种情况下没有动画，
    <code>complete</code>方法也不会被调用。  </p>
  <p>如果第一个参数是字符串而不是一个对象，它将被当作一个css关键帧动画 <a href="http://www.w3.org/TR/css3-animations/#animations">CSS
    keyframe animation</a>的名称。  </p>
  <div class="highlight">
    <pre><code class="js"><span class="nx">$</span><span class="p">(</span><span class="s2">&quot;#some_element&quot;</span><span class="p">).</span><span class="nx">animate</span><span class="p">({</span>
        <span class="nx">opacity</span><span class="o">:</span> <span class="mf">0.25</span><span class="p">,</span> <span class="nx">left</span><span class="o">:</span> <span class="s1">&#39;50px&#39;</span><span class="p">,</span>
        <span class="nx">color</span><span class="o">:</span> <span class="s1">&#39;#abcdef&#39;</span><span class="p">,</span>
        <span class="nx">rotateZ</span><span class="o">:</span> <span class="s1">&#39;45deg&#39;</span><span class="p">,</span> <span class="nx">translate3d</span><span class="o">:</span> <span class="s1">&#39;0,10px,0&#39;</span>
        <span class="p">},</span> <span class="mi">500</span><span class="p">,</span> <span class="s1">&#39;ease-out&#39;</span><span class="p">)</span>
    </code></pre>
  </div>
  <p class=compat>Zepto只使用css过渡效果的动画。jquery的easings不会支持。jquery的相对变化("=+10px") syntax 也不支持。请查看
    <a href="http://www.w3.org/TR/css3-transitions/#animatable-properties-">list of animatable properties</a>。浏览器的支持可能不同，所以一定要测试你所想要支持的浏览器。</p>
</article>



<hr>
<h2 id="touch">触控</h2>


<article class=method id="Touch events">
  <h3>Touch events
    
    
  </h3>
  
  
  <p>“touch”模块添加以下事件，可以  <a href="#on">on</a> 和 <a href="#off">off</a>。  </p>
  <ul>
    <li><code>tap</code> —元素tap的时候触发。</li>
    <li><code>singleTap</code> and <code>doubleTap</code> — 这一对事件可以用来检测元素上的单击和双击。(如果你不需要检测单击、双击，使用 <code>tap</code> 代替)。</li>
    <li><code>longTap</code> — 当一个元素被按住超过750ms触发。 </li>
    <li><code>swipe</code>, <code>swipeLeft</code>, <code>swipeRight</code>, <code>swipeUp</code>, <code>swipeDown</code> — 当元素被划过时触发。(可选择给定的方向)</li>
  </ul>
  
  
  <p>这些事件也是所有Zepto对象集合上的快捷方法。  </p>
  <div class="highlight">
    <pre><code class="html"><span class="nt">&lt;style&gt;</span><span class="nc">.delete</span> <span class="p">{</span> <span class="k">display</span><span class="o">:</span> <span class="k">none</span><span class="p">;</span> <span class="p">}</span><span class="nt">&lt;/style&gt;</span>

        <span class="nt">&lt;ul</span> <span class="na">id=</span><span class="s">items</span><span class="nt">&gt;</span>
        <span class="nt">&lt;li&gt;</span>List item 1 <span class="nt">&lt;span</span> <span class="na">class=</span><span class="s">delete</span><span class="nt">&gt;</span>DELETE<span class="nt">&lt;/span&gt;&lt;/li&gt;</span>
        <span class="nt">&lt;li&gt;</span>List item 2 <span class="nt">&lt;span</span> <span class="na">class=</span><span class="s">delete</span><span class="nt">&gt;</span>DELETE<span class="nt">&lt;/span&gt;&lt;/li&gt;</span>
        <span class="nt">&lt;/ul&gt;</span>

        <span class="nt">&lt;script&gt;</span>
        <span class="c1">// show delete buttons on swipe</span>
        <span class="nx">$</span><span class="p">(</span><span class="s1">&#39;#items li&#39;</span><span class="p">).</span><span class="nx">swipe</span><span class="p">(</span><span class="kd">function</span><span class="p">(){</span>
        <span class="nx">$</span><span class="p">(</span><span class="s1">&#39;.delete&#39;</span><span class="p">).</span><span class="nx">hide</span><span class="p">()</span>
        <span class="nx">$</span><span class="p">(</span><span class="s1">&#39;.delete&#39;</span><span class="p">,</span> <span class="k">this</span><span class="p">).</span><span class="nx">show</span><span class="p">()</span>
        <span class="p">})</span>

        <span class="c1">// delete row on tapping delete button</span>
        <span class="nx">$</span><span class="p">(</span><span class="s1">&#39;.delete&#39;</span><span class="p">).</span><span class="nx">tap</span><span class="p">(</span><span class="kd">function</span><span class="p">(){</span>
        <span class="nx">$</span><span class="p">(</span><span class="k">this</span><span class="p">).</span><span class="nx">parent</span><span class="p">(</span><span class="s1">&#39;li&#39;</span><span class="p">).</span><span class="nx">remove</span><span class="p">()</span>
        <span class="p">})</span>
        <span class="nt">&lt;/script&gt;</span>
    </code></pre>
  </div>
  
  
  
  
</article>



<hr>
<h2 id="changelog">更改日志</h2>


<article class=changelog id="changelog-v1.0">
  <h3>
    v1.0
    <small>&mdash; <i>02 Mar 2013</i>
      &mdash; <a href="https://github.com/madrobby/zepto/compare/v1.0rc1...v1.0">diff</a>
      </small>
  </h3>
  <p><em>Party like it&rsquo;s one-oh!</em></p>
  
  <h4>Notable changes</h4>
  
  <ul>
    <li>Zepto is now compatible with Twitter Bootstrap</li>
    <li>Portable, completely new node.js-based build system</li>
    <li>Fully automated tests with PhantomJS and Travis CI</li>
    <li>Removed <code>touch</code> module from default distribution</li>
  </ul>
  
  
  <h4>New features</h4>
  
  <ul>
    <li><code>$.fn.filter(function(index){ ... })</code></li>
    <li><code>$.fn.contents()</code></li>
    <li><code>$.fn.wrapInner()</code></li>
    <li><code>$.fn.scrollTop()</code></li>
    <li><code>$.contains()</code></li>
    <li><code>$.fn.has()</code></li>
    <li><code>$.fn.position()</code></li>
    <li><code>$.fn.offsetParent()</code></li>
    <li><code>$.parseJSON()</code></li>
    <li><code>$.camelCase()</code></li>
    <li><code>$.isWindow()</code></li>
    <li><code>$.grep()</code> (interface to <code>Array.filter</code>)</li>
    <li>Support <code>$(html, attributes)</code> syntax for element creation</li>
    <li>Emulate <code>mouseenter</code> and <code>mouseleave</code> events</li>
    <li>Bootstrap compat: support <code>$.fn.offset(coordinates)</code></li>
    <li>Bootstrap compat: implement <code>$.fn.detach()</code></li>
    <li>Add support for Ajax <code>cache: false</code> option</li>
    <li>Prevent scrolling when horizontal swipe events are detected</li>
    <li><code>cancelTouch</code> for tap events</li>
    <li><code>prev</code> and <code>next</code> now support an optional selector argument</li>
    <li><code>$.fn.find</code> and <code>$.fn.closest</code> now support Zepto objects as arguments</li>
    <li>Enable deep copy via <code>$.extend(true, target, source)</code></li>
    <li>Enable nested structures for <code>$.fn.wrap()</code> and <code>$.fn.wrapAll()</code></li>
    <li>Enable function arguments for <code>$.fn.wrap()</code> and <code>$.fn.wrapInner()</code></li>
    <li>Support number, boolean, JSON types in data attributes</li>
    <li>Support manipulating classnames on SVG elements</li>
    <li>Enable named durations for <code>animate</code>, e.g. <code>slow</code>.</li>
    <li>Support <code>timing-function</code> for <code>animate</code></li>
    <li>Support event properties passed to <code>$.fn.trigger()</code> or <code>$.Event()</code></li>
    <li>Selector module: support child <code>&gt; *</code> queries</li>
    <li>Add detect support for mobile Chrome browser</li>
    <li>Add <code>$.os.phone</code> and <code>$.os.tablet</code> (booleans)</li>
    <li>Detect Firefox mobile, Playbooks and BB10</li>
  </ul>
  
  
  <h4>Fixes</h4>
  
  <ul>
    <li>Fix passing null selector to <code>on</code> or <code>off</code></li>
    <li>Fixed bug where self-closing html tags would act as open tags</li>
    <li>Fix <code>val</code> for multiple select</li>
    <li>Fix various touch and gesture bugs.</li>
    <li>Corrected parameters of <code>load</code> success callback to match jQuery.</li>
    <li>Fix <code>css</code> with 0 values and falsy values</li>
    <li>Fix a <code>css</code> performance issues with string values</li>
    <li>Fix <code>$.ajaxJSONP</code> when invoked directly</li>
    <li>Fix <code>animate</code> with 0 durations.</li>
    <li>Fix <code>toggle</code> and <code>fadeToggle</code> for multiple elements.</li>
    <li>Fix ajax <code>$.fn.load</code> behavior with selector</li>
    <li>Make <code>attr(name, null)</code> unset attribute</li>
    <li>Fix <code>animate</code> in Firefox</li>
    <li>Fix <code>animate</code> for elements just added to DOM</li>
    <li>Fix an escaping issue with <code>$.param</code></li>
    <li>Respect <code>traditional: true</code> option in <code>$.ajax</code></li>
    <li>Fix <code>focus</code> &amp; <code>blur</code> event delegation and enable unbind</li>
    <li>Simple wrapping for any object passed to <code>$()</code></li>
    <li>Enable <code>children</code> method for XML documents</li>
    <li>Don&rsquo;t eval <code>&lt;script&gt;</code> content when <code>src</code> is present</li>
    <li>Support <code>processData</code> option for <code>$.ajax()</code></li>
    <li>Enable passing <code>contentType: false</code> to <code>$.ajax()</code></li>
    <li>Apply <code>focus()</code> and <code>blur()</code> to all elements in collection</li>
    <li>Change <code>$.fn.map()</code> to return a Zepto collection</li>
    <li>Selector argument for <code>on(evt, selector, fn)</code> can be false</li>
    <li>Don&rsquo;t raise error on <code>$('#')</code></li>
    <li>Provide empty object in <code>$.support</code></li>
    <li><code>return false</code> in event handler calls stopPropagation()</li>
    <li>Fix <code>$.isPlainObject()</code> for <code>window</code> in Opera</li>
    <li><code>$.ajax</code> error callback correctly reports <code>abort</code> status</li>
    <li>Fix <code>hasClass</code> in collections of multiple elements</li>
    <li>Stop iteration in <code>each()</code> when the callback returns false</li>
    <li>Add ability to set <code>xhr</code> factory per-request</li>
    <li>Have <code>get()</code> method accept negative index</li>
    <li>Support for multiple class names in <code>toggleClass()</code></li>
    <li>Fix error callbacks for <code>ajaxJSONP</code></li>
    <li>Support optional <code>data</code> argument for various Ajax methods</li>
    <li>Fix DOM insertion operators for null values</li>
    <li>Fix dataType being set for <code>$.getJSON</code></li>
  </ul>
  
  
</article>

<article class=changelog id="changelog-v1.0rc1">
  <h3>
    v1.0rc1
    <small>&mdash; <i>09 Apr 2012</i>
      &mdash; <a href="https://github.com/madrobby/zepto/compare/v0.8...v1.0rc1">diff</a>
      </small>
  </h3>
  <p>The <em>semicolon-free</em> edition! That&rsquo;s right, we removed all trailing semicolons
    from the source and tests. <a href="http://mislav.uniqpath.com/2010/05/semicolons/" title="Semicolons in JavaScript are optional">They were never needed anyway</a>.</p>
  
  <p>New methods:</p>
  
  <ul>
    <li><a href="#clone">clone</a></li>
    <li><a href="#prop">prop</a></li>
    <li><a href="#$.isPlainObject">$.isPlainObject</a></li>
    <li><a href="#$.inArray">$.inArray</a></li>
    <li><a href="#$.trim">$.trim</a></li>
    <li><a href="#$.proxy">$.proxy</a></li>
  </ul>
  
  
  <p>New module:</p>
  
  <ul>
    <li>&ldquo;selector.js&rdquo; with experimental support for jQuery CSS
      pseudo-selectors such as <code>:visible</code> and <code>:first</code></li>
  </ul>
  
  
  <h4>Improvements in core:</h4>
  
  <ul>
    <li>added missing methods for Ember.js compatibility</li>
    <li>improved creating DOM fragments from HTML with <a href="#$()">$()</a></li>
    <li>enable <a href="#append">append</a> &amp; family to accept multiple arguments</li>
    <li>fix <a href="#$.each">$.each</a> context</li>
    <li>fix calling <a href="#get">get</a> without index</li>
    <li>fix calling <a href="#val">val</a> on empty collection</li>
    <li>using <code>css(property, '')</code> removes the property</li>
    <li>fix <a href="#filter">filter</a>, <a href="#is">is</a>, and <a href="#closest">closest</a> when operating on
      nodes that are detached from the document</li>
    <li>remove <code>end</code> &amp; <code>andSelf</code> from core to the new &ldquo;stack.js&rdquo; plugin</li>
    <li>exposed important internal Zepto functions through the <code>$.zepto</code> object for
      extending or overriding Zepto functionality.</li>
    <li><a href="#data">data</a> method returns undefined when there is no data</li>
    <li>support camelized names in <a href="#data">data</a> method</li>
  </ul>
  
  
  <p>Apart from improving the basic <code>data</code> method in core, the &ldquo;data.js&rdquo; module got
    improvements as well:</p>
  
  <ul>
    <li>better jQuery compatibility</li>
    <li>ability to store functions</li>
    <li>new <code>removeData</code> method</li>
  </ul>
  
  
  <h4>Ajax:</h4>
  
  <ul>
    <li>have correct ajaxComplete argument order for JSONP abort and timeout</li>
    <li>JSONP requests that hit a 404 will now correctly invoke the error callback</li>
    <li>add support for <code>dataType: 'jsonp'</code> in <a href="#$.ajax">$.ajax</a></li>
    <li>add support for <code>data</code> in <a href="#$.ajaxJSONP">$.ajaxJSONP</a></li>
    <li>HTTP 304 status is treated as success instead of an error</li>
    <li>made <a href="#load">load</a> more compatible with jQuery</li>
    <li>allow Content-Type to be set via request headers</li>
    <li>respect Content-Type of the response if <code>dataType</code> isn&rsquo;t set</li>
    <li>work around Chrome CORS bug when data is empty</li>
  </ul>
  
  
  <h4>Changes in other modules:</h4>
  
  <ul>
    <li>fix <a href="#animate">animate</a> for edge cases such as when there is an animation
      within an animated element, and improve handling of transition CSS properties</li>
    <li>new &ldquo;singleTap&rdquo; event</li>
    <li>improved &ldquo;longTap&rdquo; detection</li>
  </ul>
  
  
</article>

<article class=changelog id="changelog-0.8">
  <h3>
    0.8
    <small>&mdash; <i>03 Nov 2011</i>
      &mdash; <a href="https://github.com/madrobby/zepto/compare/v0.7...v0.8">diff</a>
      </small>
  </h3>
  <ul>
    <li>CSS transitions for every browser with <code>animate()</code> method;</li>
    <li>unified event handling with <code>fn.on()</code> &amp; <code>off()</code>;</li>
    <li>Ajax global events &amp; timeout support;</li>
    <li>performance boost for selectors.</li>
  </ul>
  
  
  <p>See <a href="https://gist.github.com/1337487" title="Zepto 0.8 release notes">full release notes</a>.</p>
  
</article>

<article class=changelog id="changelog-0.7">
  <h3>
    0.7
    <small>&mdash; <i>01 Aug 2011</i>
      &mdash; <a href="https://github.com/madrobby/zepto/compare/v0.6...v0.7">diff</a>
      </small>
  </h3>
  <ul>
    <li>add <code>$.each</code>, <code>$.map</code>, <code>$.slice</code>;</li>
    <li>add <code>.serializeArray()</code>, <code>.serialize()</code>;</li>
    <li>add <code>.triggerHandler()</code>;</li>
    <li>add <code>.wrap</code>, <code>.wrapAll</code>, <code>.unwrap</code>, <code>.width/height</code> setters, <code>.append</code> (and
      friends) improvements;</li>
    <li>add &ldquo;longTap&rdquo; event;</li>
    <li><code>.anim()</code> accepts CSS transform properties;</li>
    <li><code>return false</code> in event handlers cancels browser event behavior.</li>
  </ul>
  
  
</article>

<article class=changelog id="changelog-0.6">
  <h3>
    0.6
    <small>&mdash; <i>14 May 2011</i>
      &mdash; <a href="https://github.com/madrobby/zepto/compare/v0.5...v0.6">diff</a>
      </small>
  </h3>
  <ul>
    <li>add <code>.add</code>, <code>.appendTo</code>, <code>.prependTo</code>, <code>.replaceWith</code>, <code>.empty</code>, <code>.submit</code>;</li>
    <li>allow function args for <code>.add/.remove/.toggleClass</code>;</li>
    <li>improvements to events and xhr.</li>
  </ul>
  
  
</article>

<article class=changelog id="changelog-0.5">
  <h3>
    0.5
    <small>&mdash; <i>01 Mar 2011</i>
      &mdash; <a href="https://github.com/madrobby/zepto/compare/v0.4...v0.5">diff</a>
      </small>
  </h3>
  <ul>
    <li>add <code>.not</code>, <code>.children</code>, <code>.siblings</code>, <code>$.param</code>;</li>
    <li>improve <code>.attr</code> &amp; <code>.html</code>;</li>
    <li>support callback for <code>.anim</code>.</li>
  </ul>
  
  
</article>

<article class=changelog id="changelog-0.4">
  <h3>
    0.4
    <small>&mdash; <i>21 Jan 2011</i>
      &mdash; <a href="https://github.com/madrobby/zepto/compare/v0.3...v0.4">diff</a>
      </small>
  </h3>
  <ul>
    <li>JSONP;</li>
    <li>better <code>.find</code>, <code>.each</code>, <code>.closest</code>;</li>
    <li>add <code>.eq</code>, <code>.size</code>, <code>.parent</code>, <code>.parents</code>, <code>.removeAttr</code>, <code>.val</code>;</li>
    <li>support function args in <code>.html</code>, <code>.attr</code>;</li>
    <li>adjacency methods now take Zepto objects.</li>
  </ul>
  
  
</article>

<article class=changelog id="changelog-0.3">
  <h3>
    0.3
    <small>&mdash; <i>17 Dec 2010</i>
      &mdash; <a href="https://github.com/madrobby/zepto/compare/v0.2...v0.3">diff</a>
      </small>
  </h3>
  <ul>
    <li>add <code>.toggleClass</code>, <code>.attr</code> setter, <code>.last</code>, <code>.undelegate</code>, <code>.die</code>;</li>
    <li>proxied event objects for event delegation;</li>
    <li>support <code>$</code> fragments.</li>
  </ul>
  
  
</article>

<article class=changelog id="changelog-0.2">
  <h3>
    0.2
    <small>&mdash; <i>01 Dec 2010</i>
      &mdash; <a href="https://github.com/madrobby/zepto/compare/v0.1...v0.2">diff</a>
      </small>
  </h3>
  <ul>
    <li>now compatible with <a href="http://documentcloud.github.com/backbone/">backbone.js</a>;</li>
    <li>support event unbind;</li>
    <li>ajax posts with data.</li>
  </ul>
  
  
</article>

<article class=changelog id="changelog-0.1">
  <h3>
    0.1
    <small>&mdash; <i>26 Oct 2010</i>
      
      </small>
  </h3>
  <p><a href="https://github.com/madrobby/zepto/blob/v0.1/src/zepto.js">First. Release.</a> Ever.</p>
  
</article>


<hr>
<h2 id=thanks>Acknowledgements &amp; Thanks</h2>

<p>
  A big <b>Thank-You</b> goes out to all of our
  <a href="https://github.com/madrobby/zepto/contributors">awesome Zepto.js contributors</a>.
  May you all forever bask in glory.
</p>

<p>
  The Zepto API is based on <a href="http://jquery.com/">jQuery's Core API</a>, which
  is released under the <a href="https://github.com/jquery/jquery/blob/master/MIT-LICENSE.txt">MIT license</a>.
</p>

<p>
  This documentation is based on the layout of the
  <a href="https://github.com/documentcloud/backbone/">Backbone.js</a>
  documentation, which is released under the
  <a href="https://github.com/documentcloud/backbone/blob/master/LICENSE">MIT license</a>.
</p>

<p>
  <small>
    &copy; 2010-2013 Thomas Fuchs, <a href="http://letsfreckle.com">Freckle Online Time Tracking</a><br>
    Zepto and this documentation is released under the terms of the <a href="https://github.com/madrobby/zepto/blob/master/MIT-LICENSE">MIT license</a>.
    </small>
</p>

</section>

</div>
</body>
</html>
